Jquery对话框仅适用于第一个链接?

时间:2013-02-27 14:42:59

标签: jquery html jquery-ui

<script type="text/javascript">
$(function(){
$("#headings_help").click(function(){
$("#box").dialog({

    title: 'Heading and Subheading IDs',
    width: 700,
    height:300,
    modal:true,
    resizable:false,
    buttons: [
    {
      text: 'Close',
      click: function(){
      $(this).dialog('close');
    }
    }
    ]

    });
    });


});
</script>

对于上述javascript,请假设您将此内联元素作为表单的一部分:

Help<a id='headings_help' ><img src='questionmark.png' border='0' /></a>

假设上面的问号是在网页上的多个位置,jquery代码仅适用于第一个问号链接实例。它不适用于同一页面上的其他问号。

4 个答案:

答案 0 :(得分:1)

change this
Help<a class='headings_help' ><img src='questionmark.png' border='0' /></a>
and then
<script type="text/javascript">
$(function(){
$(".headings_help").click(function(){
$("#box").dialog({

    title: 'Heading and Subheading IDs',
    width: 700,
    height:300,
    modal:true,
    resizable:false,
    buttons: [
    {
      text: 'Close',
      click: function(){
      $(this).dialog('close');
    }
    }
    ]

    });
    });


});
</script>

答案 1 :(得分:0)

答案不是使用id,而是使用普通类。

ID是单数的,它们不打算在页面上重复。

所以将id更改为类

<a class='headings_help' ><img src='questionmark.png' border='0' /></a>

更改选择器以使用类

$(".headings_help").on("click, function(){...});

答案 2 :(得分:0)

 apply same css class to all links 

 then use 

 $(".className").click(function(){
      .........
})

我们不能将ont id用于多个元素。当你想将一个事件应用于多个元素时,然后将css类应用于all,然后使用。

答案 3 :(得分:0)

// Get all the links that have an image with `src` `questionmark.png`
var $Links = $.map($('a img[src="questionmark.png"]'), function () {
    return $(this).parent(); // return the parent
});

// Apply click for each of the links
$Links.click(function () {
    // Do your stuff here.
});