JQuery tools, overflow images from input box
I'm creating an interface with JQuery tools, using the overlay functions.
So, I have a list of a tags that shows images in overlay
<a id="11" href="data/images/011.jpg">
<a id="12" href="data/images/012.jpg">
<a id="13" href="data/images/013.jpg">
<a id="14" href="da开发者_StackOverflowta/images/014.jpg">
then I have an input box (without form tag) and I just want to write in there "11" and, clicking on a "show image" link, it goes in overlay Something like this:
<input type="text" id="searchBox" />
<a id="searchButton" href="#">Cerca</a>
An alert works doing:
$("#searchButton").click(function(){
alert($("#searchBox").val());
});
So, how can I "search" the image (trough the ID) and simulate a real click?
thanks!!! Teo
See the web standard for element ID syntax
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").
So, to be standards compliant, change markup to something like:
<a id="p11" href="data/images/011.jpg"></a>
<a id="p12" href="data/images/012.jpg"></a>
<a id="p13" href="data/images/013.jpg"></a>
<a id="p14" href="data/images/014.jpg"></a>
Javascript:
$("#searchButton").click(function(){ //set click event of search button
var piclink_num = $("#searchBox").val(); //get user input which is expected to be numeric part of link ID
$("#p" + piclink_num).trigger('click'); //trigger click event of intended link
});
This should invoke the click event on the appropriate link
$('#'+$("#searchBox").val()).click();
You are trying to simulate the click on the image? In that case, it would be like
$('#'+$("#searchBox").val()).click()
$("#searchButton").click(function(){
var anchorId = $("#searchBox").val();
alert( $("#" + anchorId).attr("href") );
});
This should grab the href you need.
精彩评论