javascript - 无法执行点击事件

Question

引用以下链接http://jsfiddle.net/Xtreu/ ，我尝试在单击事件 删除我的数据 按钮上执行相同的功能，而不使用任何表单。我尝试了不同的方式，但它没有发生。任何人都可以帮助我如何使用 click 事件执行相同的示例吗？

HTML:

<form method="post" action="/echo/html/">
    <input type="hidden" name="html" value="&lt;p&gt;Your data has been deleted&lt/p&gt;" />
    <input type="submit" value="Delete My Data" />
</form>
<div id="confirmBox">
    <div class="message"></div>
    <span class="button yes">Yes</span>
    <span class="button no">No</span>
</div>

JavaScript:

function doConfirm(msg, yesFn, noFn) {
    var confirmBox = $("#confirmBox");
    confirmBox.find(".message").text(msg);
    confirmBox.find(".yes,.no").unbind().click(function () {
        confirmBox.hide();
    });
    confirmBox.find(".yes").click(yesFn);
    confirmBox.find(".no").click(noFn);
    confirmBox.show();
}

$(function () {
    $("form").submit(function (e) {
        e.preventDefault();
        var form = this;
        doConfirm("Are you sure?", function yes() {
            form.submit();
        }, function no() {
            // do nothing
        });
    });
});

Answer 1

这里的代码没有使用form

试试这个例子

<div id="msg" style="display:none">Your data has been deleted</div>
<input type="button" id="d_btn" value="Delete My Data" />
<div id="confirmBox">
    <div class="message"></div> <span class="button yes">Yes</span>
 <span class="button no">No</span>

</div>

脚本

function doConfirm(msg, yesFn, noFn) {
    var confirmBox = $("#confirmBox");
    confirmBox.find(".message").text(msg);
    confirmBox.find(".yes,.no").unbind().click(function () {
        confirmBox.hide();
    });
    confirmBox.find(".yes").click(yesFn);
    confirmBox.find(".no").click(noFn);
    confirmBox.show();
}

$(function () {
    $("#d_btn").click(function (e) {
        e.preventDefault();
        var form = $(this).closest('form');
        doConfirm("Are you sure?", function yes() {
            $('#d_btn').hide()
            $('#msg').show()
        }, function no() {
            // do nothing
        });
    });
});

DEMO