Question

我正在尝试使用ajax和jquery在按钮单击时加载一个html文件但是没有加载它.Below是代码。

ajax.aspx文件： -

<form id="form1" runat="server">
    <div id="dictionary"></div>
    <div class="letters">
        <div class="button" id="letter-a">
            <h3>A</h3>
            <button type="button">Load</button>
        </div>
        <div class="button" id="letter-b">
            <h3>B</h3>
            <button type="button">Load</button>
        </div>
        <div class="button" id="letter-c">
            <h3>C</h3>
            <button type="button">Load</button>
        </div>
        <div class="button" id="letter-d">
            <h3>D</h3>
            <button type="button">Load</button>
        </div>
    </div>
</form>

ajax.js文件： -

$(document).ready(function () {
    $('#letter-a .button').click(function () {
        $('#dictionary').load('html_ajax.htm');
    });
});

但它不起作用。我错过了什么？提前谢谢。

Answer 1

改变这个：

$('#letter-a .button').click(function () {

到

$('#letter-a button').click(function() {

您正在使用类选择器来选择button标记。您的选择器选择具有button类的元素。

Answer 2

我认为你需要删除。来自.button - .button意味着有一类按钮。

这意味着“查找id为”letter-a“和”class“按钮的元素。

 $('#letter-a .button').click(function () { }

这意味着“查找包含在id为”letter-a“的元素中的按钮元素。

$('#letter-a button').click(function () { }

Jquery没有在按钮点击时加载html页面

2 个答案: