在 jquery ajax 成功后重新应用 javascript 插件

Question

我一直在尝试从类似的帖子中获得不同的建议。在从公司 select 发送公司 select 后，无法对收件人 select 重新应用 Javascript 功能。 HTML:

<div id="recipient-container" class="formRightMM noSearch">
    <select id ="outgoingRecipient" class="chzn-select">
        //options loaded depending on company chosen
    </select>
</div>

在文档加载时，select 样式由 .uniform() 从 custom.js

应用

$(function() {
    $("select, input:checkbox, input:radio, input:file").uniform();
}

收件人HTML 程式化

<div id="recipient-container" class="formRightMM noSearch">
    <div id="uniform-outgoingRecipient" class="selector">
        <span style="-moz-user-select: none;">Choose a Recipient</span>
    <select id="outgoingRecipient" class="chzn-select required chzn-done" style="display: none; opacity: 0;">
        //after company selected, ajax updates options
        <option value="827">Big Dog</option>
        <option value="828">Bob</option>
    </select>
</div>
<div id="outgoingRecipient_chzn" class="chzn-container chzn-container-single chzn-container-active" style="width: 139px;">
    <a class="chzn-single" href="javascript:void(0)" tabindex="-1">
        <span>Choose a Recipient</span>
    </a>
    <div class="chzn-drop" style="left: -9000px; width: 137px; top: 27px;">
        //but options should be stylized here by .uniform();
        <ul class="chzn-results"></ul>
    </div>

AJAX plus.js 文件

$(document).ready(function() {
    function get_recipient(){
        return $.ajax({
            type: "POST",
            url: "get_recipient.php",
            data: companyIDDataString,
            dataType: 'html',
            success: function(result){
                $('#outgoingRecipient').html(result);
            }
        //etc...

当公司被 selected 时，<options> 会更新，但 .uniform() 应用的样式不会更新 <ul> 元素。尝试了不同的方法来成功应用 .uniform() 调用。插件添加了新的 HTML，但我不确定 .uniform() 的目标是什么。尝试了 (#outgoingRecipient).uniform() 和其他一些元素 ID，但没有结果。我需要将插件作为一个整体应用于文档吗？有人给我提示吗？

Answer 1

请在构建 select 后尝试重新运行您的 js 脚本。假设您将统一插件脚本放在 uniform.js:

$(document).ready(function(){
    //your ajax call
    $.getScript("uniform.js");
});

在 jquery ajax 成功后重新应用 javascript 插件

Re-apply javascript plugin after jquery ajax success

jquery

ajax

plugins