开发者

jquery anchor popup

I am trying to take a list of anchors and show the text the anchor references to in a popup. like a pop-up glossary of sorts. I have tried a couple of different techniques but i could开发者_如何学Gont get any to work as i am very new to this. this technique worked in firefox, but not in internet explorer. any help on this would be appreciated, or if i should be using a different method to this please let me know.

i have my anchor ids as say, id="first" and then the text it references as id="2first"

$("a").click(function(){
    var toGet = $(this).attr('id');
    var holder =$("#2" + toGet);
    var toShow = $(holder).html();
    loadPopup(toShow);
    return false;
});


I'd guess that IE doesn't like id attributes that begin with a number. From the HTML4 specification:

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 (".").

HTML5 has this to say about the id attribute:

The id attribute specifies its element's unique identifier (ID). The value must be unique amongst all the IDs in the element's home subtree and must contain at least one character. The value must not contain any space characters.

So HTML5 allows you to use pretty much anything but HTML4 certainly doesn't allow an id of "2first" and that may explain IE's behavior. You may find this question of interest as well.

Try moving the "2" to the end:

$("a").click(function(){
    var toGet  = this.id;
    var holder = $("#" + toGet + '2');
    var toShow = holder.html();
    loadPopup(toShow);
    return false;
});

Demo: http://jsfiddle.net/ambiguous/ZcT9f/3/


I know that this is old, and hopefully you've found an answer by now, but maybe this will help someone else. If you want to avoid an anchor link being followed when you click on it in jQuery and you want to perform some other action instead you can do the following:

$("a").click(function(e){
    e.preventDefault();
    var toGet  = this.id;
    var holder = $("#" + toGet + '2');
    var toShow = holder.html();
    loadPopup(toShow);
    return false;
});

By adding the event, e, to the function you can now access the event and call e.preventDefault() which will prevent the link from being followed, instead it will execute the code that follows it.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜