给按钮一个类,并使用javascript来挑选点击事件不工作

Giving a class to a button and using javascript to pick up on th click event not working

本文关键字:挑选 javascript 工作 事件 按钮 一个      更新时间:2023-09-26

目前我已经创建了一个按钮:

<td><button class='ajax_button' data-id='4'>Reserve</button></td>

我也有一个javascript部分在同一文件:

$(".ajax_button").click(function(){
     var temp = $(this).data("id");
     alert(temp);
});

问题是当我点击按钮,警报弹出不显示。我能做错什么吗?

另外,我注意到在javascript中....前面有不同的符号(#事情).click美元$ (,) .click

"#"answers"。"有什么区别?"

传递给$()的值是一个CSS选择器。jQuery使用它们来尝试查找页面上的元素。在这种情况下,它可能找不到按钮,这可能是由于调用$()时元素不存在造成的。

你可能太早执行了javascript调用。如果你要求jQuery选择所有带有'ajax_button'类的元素,但是一个都不存在,那么它显然不能为任何东西添加onclick处理程序。解决这个问题的一种方法是等待整个页面加载完成。之后,添加click事件:

$(document).ready(function() {  // When the document is ready (DOM loaded)
    $(".ajax_button").click(function(){
        var temp = $(this).data("id");
        alert(temp);
    });
});

您可以为documentready事件添加多个事件处理程序,就像您可以在一个元素上添加多个click事件一样。

当然,请注意,在就绪状态之后创建的任何按钮都不会获得click事件。如果需要,请阅读。live()

我在文件中有属于ajax函数的javascript。我将javascript文件移动到正确的文件。

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    // Handling search results
    $('.ajax_button').click(function(e){
        // Get the name of the user clicked
        var lastName = $(this).data("lastName");
        var firstName = $(this).data("firstName");
        var phoneNum = $(this).data("phone");
        //alert('lastName'.value()' '.'firstName'.' '.'phoneNum');
        alert('hello');
    });
});
</script>

"#"answers"。"有什么区别?"

'#'用于选择具有特定id的HTML对象,例如:

$('#container')

将与

匹配
<div id="container"></div>

和"。'是具有特定类的HTML对象的选择器。如:

$('.button')

将与

匹配
<a class="button"></a>
<div class="button"></div>

如果你的按钮是使用javascript或ajax创建的,jquery的click事件函数不会附加到元素上,使用live事件函数,例如:

$('.ajax_button').live('click', function () {
    var temp = $(this).attr("data-id");
    alert(temp);
});