Question

请考虑以下代码：

<html>

<head>

<meta charset="UTF-8"> 

<title>title...</title>

<link type="text/css"  rel="stylesheet" href="jquery-ui-1.10.4.custom.css" />

<script type="text/javascript" src="jquery-1.10.2.js"></script> 
<script type="text/javascript" src="jquery-ui-1.10.4.custom.min.js"></script>

</head>

<body>

<div id="dialog1" style="display: none">
<p>some text</p>
</div>

<input id="but1" type="button" value="clickme" />

</body>  

<script>

$("#but1").on ('click', {valu: 1}, f);

$("#dialog1").dialog({ autoOpen:false });

function f (event) {
    console.log(event.data.valu); // EXISTS
    $.ajax({
        type: "POST",
        url: "event.xml",
        dataType: "xml",
        success: function (result) {
            console.log(event.data.valu); // DOESN'T EXIST
            var promptDialog = $("#dialog1");
            var promptDialogButtons = {};
            promptDialogButtons['ok'] = function(){
                $("#dialog1").on('click', { valu: 0 }, f);
                $("#dialog1").click();
                $("#dialog1").dialog('close');
            };
            promptDialogButtons['cancel'] = function(){
                $("#dialog1").dialog('close');
            };
            promptDialog.dialog({ width:333, modal: true, title: "sometitle", buttons:promptDialogButtons});
            $("#dialog1").dialog('open');
        }
    });
}

</script>


</html>

当点击“clickme”然后“ok”时，输出将是：

1
1
0
TypeError: event.data is null

为什么event.data.valu在递归后遗忘在$.ajax()？ event中没有重新声明参数$.ajax()。请填写JQuery库的有效路径。使用任何有效的event.xml文件。

Answer 1

显然，jquery-ui对话框确实以不同方式处理ok按钮的click事件。你的问题可以通过在成功函数中直接调用函数f来解决。

f({ data:{
       valu: 0
     }
});

见http://jsfiddle.net/klickagent/3L1zro7w/8/ 一个工作的例子

为什么在递归后忘记了事件参数？

1 个答案: