Javascript 如何组合多个$（document）.ready（）函数

我有一个创建动态

的函数。我必须使它成为一个多选择选项，所以我也必须初始化它

函数被多次调用；下面是函数：

function renderTimezoneFilterStringCriteria($filterKey,$onChange,$r,$c,$for)
    {

        echo '<script>
                $(document).ready(function()
                {
                    $("#zoneFilter_criteria_'.$for.'_'.$r.'_'.$c.'").multiselect({
                    includeSelectAllOption: true,
                    enableFiltering: true,
                    enableCaseInsensitiveFiltering: true,
                    maxHeight: 150
                 });
                });
                </script>'.'<div class="time_zone_list"><select name="rules['.$r.']['.$c.']['.$for.'_timezone]" class="input_field zonefield" id="zoneFilter_criteria_'.$for.'_'.$r.'_'.$c.'"  style="width:30%; margin-right:5px; float:left;">';
        foreach ($this->timezoneArrayNotDefault as $k => $val) {
            $selected = '';

             $val_array = explode(")",$val);
            if (isset($val_array[1]) && trim($val_array[1]) == trim($filterKey)) {
               echo $selected = SELECTED;
            }

            echo '<option value="' . $val . '"' . $selected . '>' . $val . '</option>';
        }
        echo '</select></div>';
    }

函数renderTimezoneFilterStringCriteria（$filterKey、$onChange、$r、$c$for）
{
回声'
$（文档）.ready（函数（）
{
$（“#zoneFilter_UCriteria_'.$for.''.$r.''.$c.''）。多选({
includeAlloption:true，
启用筛选：正确，
enableCaseInsensitiveFiltering:正确，
最大高度：150
});
});
'.'';
foreach（$this->timezonearaynotdefault为$k=>$val）{
$selected=''；
$val_数组=分解（“）”，$val）；
if（isset（$val_数组[1]）&&trim（$val_数组[1]）==trim（$filterKey））{
echo$selected=selected；
}
回音“.$val.”；
}
回声'；
}

现在，正如您所看到的，html是以php字符串的形式生成的（我的客户表示，通过这种方式，html加载速度更快，所以他使用了这种技术，您无法说服他改用另一种方式

现在让我们直截了当地说：如果函数被多次调用，那么它也会导致多个$（document）.ready（function（）{}）

有没有办法，我只能有

$（document.ready（）{}）并以其他方式初始化多个下拉列表？？？
设置标志变量

$firstCall = TRUE;
renderTimezoneFilterStringCriteria($filterKey,$onChange,$r,$c,$for, &$firstCall);

并检查它：

function renderTimezoneFilterStringCriteria($filterKey,$onChange,$r,$c,$for, &$firstCall)
    {
        if($firstCall) {
            echo '<script> $(doucment).ready(function() { ... '; 
            //your document.ready here
            $firstCall = FALSE;
        }
    // your other stuff here
    }

函数renderTimezoneFilterStringCriteria（$filterKey、$onChange、$r、$c、$for、&$firstCall）
{
如果（$firstCall）{
echo“$（doucment）.ready（函数（）{…”；
//你的文件准备好了吗
$firstCall=FALSE；
}
//你的其他东西在这里
}

UPD：更好的解决方案可能是使单个函数与您的document.ready相呼应，并调用它一次。
以下是添加新html时重新绑定代码的示例


Html


我是一颗纽扣


添加按钮


重新绑定

Jquery

$(document).ready(function(){

    //function to rebind
    function rebind() {
        $('.button-item').click(function(){
           alert("Im binded");
        })             
    }

    //initial bind on page load
    rebind()

    //adding new html thats unbinded
    $("#add-html").click(function(){
         $("#container").append('<button class="button-item">I am a button</button>')
    })

    //calls function to bind new html 
    $("#rebind").click(function(){
        rebind()
    })

})

$（文档）.ready（函数（）{
//重新绑定的函数
函数重新绑定（）{
$（'.button项'）。单击（函数（）{
警报（“即时绑定”）；
})             
}
//页面加载时的初始绑定
重新绑定（）
//添加未绑定的新html
$（“#添加html”）。单击（函数（）{
$（“#容器”）.append（'我是一个按钮'）
})
//调用函数来绑定新的html
$（“#重新绑定”）。单击（函数（）{
重新绑定（）
})
})

因此，这里发生的基本情况是，当页面加载时，您将首先将警报代码绑定到按钮，但当您将新html附加到页面时，您将看到新按钮不会触发单击事件，即使它具有相同的类。这是因为它未绑定。一旦单击该重新绑定按钮，它将重新绑定所有按钮h该类（按钮项）。您可以使用相同的概念，但每次添加动态html时，它都会调用重新绑定函数。
添加更多html时，请尝试重新绑定jquery。因此，当页面附加新html时，您会调用重新绑定函数，将jquery重新绑定到当前html。如何？您可以忽略一段代码？？？@mattfetzno，实际上我错了在那里，我的原始代码是fine，我用一个例子给出了答案。
$(document).ready(function(){

    //function to rebind
    function rebind() {
        $('.button-item').click(function(){
           alert("Im binded");
        })             
    }

    //initial bind on page load
    rebind()

    //adding new html thats unbinded
    $("#add-html").click(function(){
         $("#container").append('<button class="button-item">I am a button</button>')
    })

    //calls function to bind new html 
    $("#rebind").click(function(){
        rebind()
    })

})