0

我有一个带有 jquery 的单击事件处理程序。如果文本字段为空白，我返回 false 否则将一些变量提交给另一个函数。如果我再次触发该事件，似乎仍然设置了以前的变量，并且设置了新的变量，函数循环两次。我希望这是因为我不太明白发生了什么。

可点击的：

<p class="field_select custom" data-table="" data-field="_text">Your Custom Text</p>

处理程序：

$('.field_select').click(function(){

    if ($(this).hasClass('custom')){
        //This is a custom field

        //reset the input to empty
        $('#custom_text_input').val('');

        //get the data we need for our ajax function
        field = $(this).data('field');
        table = $(this).data('table');

       //open up the dialog with the input field
       $('#custom_field_div').dialog({
           modal: true,
           width: 500,
           height: 275,
           buttons: { "Ok": function() { $(this).dialog("close"); } }
       });

       //when we close the dialog check for empty value and fire function
        $('#custom_field_div').on('dialogclose', function(){
            name = $('#custom_text_input').val();
            if (name !== ''){
                //the user filled the field - fire the function.
                custom = $('#custom_text_input').val();
                append_field(field, name, custom, table);
            }
            else {
                //the user did not fill the field, do nothing.
                alert('not recording anything');
                alert(name);
                return false;

//------------------after the first blank submission the second will 
//------throw the alerts twice!!! and then the next time THREE and so on... 
                    }
                });
            }
            else{
                //this is not a custom field
               table = $(this).data('table');
               field = $(this).data('field');
               name = $(this).html();
               append_field(field, name, table);
            }
        });

隐藏对话框 div 的 HTML

<div id="custom_field_div">
    <label>Enter your custom text...</label>
    <input type="text" id="custom_text_input" maxlength="255" rows="3" style="width: 100%!important; height: 50px;"></textarea>
</div>

我在控制台中没有看到任何错误...

4

1 回答 1

1

每次单击处理程序运行时，都会执行此行：

$('#custom_field_div').on('dialogclose', function(){

这为事件添加了另一个处理程序。dialogclose当该事件发生时，所有处理程序都会被触发。

重构代码以在单击处理程序之外设置对话框，或在每次关闭时销毁对话框。我会建议第一个选项。

于 2013-08-16T21:47:00.950 回答