如何解决如何克服函数中的嵌套?
| 我对javascript和jquery很陌生,遇到了一个我尚未找到解决方案的问题。我将尝试以一种非常简单的方式对其进行绘制。 我有一个页面可以为用户提供一些选择(例如游戏),例如攻击或防御,使用哪种武器。然后,它加载两个html \,每个都有一个“ commit”按钮。提交按钮与将数据传递到ajax的(单独的)函数绑定在一起。 我遇到的问题是我被嵌套函数所埋没了。那有意义吗?我的代码如下所示: 码:$(function() {
$(\'#choice1\').click(function() {
//do some stuff
});
$(\'#choice2\').click(function() {
//do some stuff
});
$(\'#choice3\').click(function() {
//do some stuff,including creating the choices below,and their submit Boxes
$(\'#subChoice1\').click(function() {
//send data with ajax to a PHP document. get result
//create some text on my document to display results
//create an input button,along with an id=\"subButton1\"
});
$(\'#subChoice2\').click(function() {
//send data with ajax to a PHP document. get result
//create some text on my document to display results
//create an input button,along with id=\"subButton1\"
//(yes,Feed both back to same func)
});
}); // end choice3
$(\'#subButton1\').click(function() {
//my buttons in the subChoices do not call this function(!!??)
});
});
编辑:链接不再有效,抱歉。我在这里创建了一个生动的例子。
感谢您的提示或指示。我几乎可以肯定,有些简单的事情我会丢失或不知道,这会让我走上正确的道路。
解决方法
您总是可以使用普通的命名函数来代替内联匿名函数。如果功能太多了,那可能会有所帮助。
更新:
这是您的工作案例1:
$(\'#button1\').click(function(){
$(\'#div1\').append(\'<span id=\"span1\"><br>Alright. Button 1 worked. Here\\\'s another button.</br></span>\');
$(\'#div1\').append(\'<input type=\"button\" value = \"Button 2\" id=\"button2\"/>\')
$(\'#button2\').click(function() {
$(\'#div1\').append(\'<span id=\"span1\"><br>Hey! Button 2 worked!. Let\\\'s keep going.</br></span>\');
$(\'#div1\').append(\'<input type=\"button\" value = \"Button 3\" id=\"button3\"/>\')
$(\'#button3\').click(function() {
$(\'#div1\').append(\'<span id=\"span1\"><br>Hey! Button 3 worked!. That\\\'s probably enough.</br></span>\');
});
});
});
我提议的是这样更新它:
function button3_click() {
$(\'#div1\').append(\'<span id=\"span1\"><br>Hey! Button 3 worked!. That\\\'s probably enough.</br></span>\');
}
function button2_click() {
$(\'#div1\').append(\'<span id=\"span1\"><br>Hey! Button 2 worked!. Let\\\'s keep going.</br></span>\');
$(\'#div1\').append(\'<input type=\"button\" value = \"Button 3\" id=\"button3\"/>\');
$(\'#button3\').click(button3_click);
}
function button1_click() {
$(\'#div1\').append(\'<span id=\"span1\"><br>Alright. Button 1 worked. Here\\\'s another button.</br></span>\');
$(\'#div1\').append(\'<input type=\"button\" value = \"Button 2\" id=\"button2\"/>\')
$(\'#button2\').click(button2_click);
}
$(\'#button1\').click(button1_click);
这样,逻辑的结构就保持不变,但是您可以提取嵌套的函数定义。
,如果您一直在为提交按钮重复使用类或ID,则可以利用jQuery的live()
方法。它将允许您在单击处理程序之外为父选项创建$(\'#subChoice1\')
和$(\'#subChoice2\')
的绑定,但在创建它们时仍将它们正确绑定。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。