页面加载时引发javascript更改事件-如何避免这种情况？

我有一个带有链式选择框的表单。zend控制器为这些选择框设置默认值。这些值来自db。我是jquery的新手

$form->setDefaults($data);

已加载jquery文件：

$(document).ready(function(){

        // set up the chained select
        $("#region").remoteChained("#country", "/ws/regionstructure");
        $("#province").remoteChained("#region", "/ws/regionstructure");
        $("#town").remoteChained("#province", "/ws/regionstructure");

     });

问题在于，当页面加载时，它会触发国家/地区的更改事件，并重置所有选择

以下是正在调用的remoteChained jquery代码：

/*
 * Remote Chained - jQuery AJAX(J) chained selects plugin
 *
 * Copyright (c) 2010-2011 Mika Tuupola
 *
 * Licensed under the MIT license:
 *   http://www.opensource.org/licenses/mit-license.php
 *
 */

(function($) {

    $.fn.remoteChained = function(parent_selector, url, options) { 

        return this.each(function() {

            /* Save this to self because this changes when scope changes. */            
            var self   = this;
            var backup = $(self).clone();

            /* Handles maximum two parents now. */
            $(parent_selector).each(function() {
                $(this).bind("change", function() {

                    /* Build data array from parents values. */
                    var data = {};
                    $(parent_selector).each(function() {
                        var id = $(this).attr("id");
                        var value = $(":selected", this).val();
                        data[id] = value;
                    });

                    $.getJSON(url, data, function(json) {

                        /* Clear the select. */
                        $("option", self).remove();

                        /* Add new options from json. */
                        for (var key in json) {
                            if (!json.hasOwnProperty(key)) {
                                continue;
                            }
                            /* This sets the default selected. */
                            if ("selected" == key) {
                                continue;
                            }
                            var option = $("<option />").val(key).append(json[key]);
                            $(self).append(option);    
                        }

                        /* Loop option again to set selected. IE needed this... */ 
                        $(self).children().each(function() {
                            if ($(this).val() == json["selected"]) {
                                $(this).attr("selected", "selected");
                            }
                        });

                        /* If we have only the default value disable select. */
                        if (1 == $("option", self).size() && $(self).val() === "") {
                            $(self).attr("disabled", "disabled");
                        } else {
                            $(self).removeAttr("disabled");
                        }

                        /* Force updating the children. */
                        $(self).trigger("change");

                    });
                });

                /* Force updating the children. */
                $(this).trigger("change");             

            });
        });
    };

    /* Alias for those who like to use more English like syntax. */
    $.fn.remoteChainedTo = $.fn.remoteChained;

})(jQuery);

---

我认为删除更改事件没有任何问题，但插件的工作方式似乎效率很低。我未经测试就重构了它，所以试试看它是如何为您工作的

你可以这样称呼它：

$( "#region" ).remoteChained( { parentSelector: "#country", url: "/ws/regionstructure" } );
$( "#province" ).remoteChained( { parentSelector: "#region", url: "/ws/regionstructure" } );
$( "#town" ).remoteChained( { parentSelector: "#province", url: "/ws/regionstructure" } );

这不应触发更改事件。如果您发现需要这样做，您可以这样做：

$( '#region' ).trigger( 'change' );

这是新的插件代码。如果您有任何问题，请告诉我：

( function( $ ) {

    $.fn.remoteChained = function ( options ) {
        var defaults = { },
            settings = $.extend( { }, defaults, options );

        return this.each( function () {

            var el = $( this ),
                parent = $(settings.parentSelector),
                data = { };

            parent.each( function () {
                var el = $(this);
                data[ el.attr( 'id' ) ] = el.find( ':selected' ).val(); 
            });

            parentSelector.bind( 'change.remotechanged', function ( e ) {
                var request = $.ajax( { url: settings.url, data: data } );

                request.done( function ( response ) {
                    var newOption;

                    el.find( 'option' ).remove();

                    for ( var key in response ) {
                        if ( !response.hasOwnProperty( key ) ) {
                            continue;
                        }

                        newOption = $( '<option />' )
                            .val( key )
                            .append( response[ key ] );

                        key === 'selected' && newOption.attr( 'selected', 'selected' );

                        newOption.appendTo( el );
                    }

                    if ( el.find( 'option' ).length === 1 && el.val() === '' ) {
                        el.attr( 'disabled', 'disabled' );
                    } else {
                        el.removeAttr( 'disabled' );
                    }
                });
            });

        });

    };

})( jQuery );

---

在PHP中从控制器设置默认值不应导致触发更改事件，因为这都是服务器端的。该网页尚不存在。如果表单尚未发布，您可能应该只调用setDefaults。您是对的，drew-我将修改我的问题，我认为行$this.triggerchange；当您创建并注册新的链接输入时，正在无条件运行。我认为这就是导致这种变化的原因，甚至引发了火灾。也就是说，我不确定解决方案是什么，或者移除该线路是否安全，希望有人能回答。嗨。谢谢你。我还没能让它工作。我想您给我的代码行中有一个错误：$region.remoteChained{parentSelector:country，url:/ws/regionstructure}；$province.remoteChained{parentSelector:region，url:/ws/regionstructure}；$town.remoteChained{parentSelector:province，url:/ws/regionstructure}；--我认为这是因为在这些行之后，我的jquery不再适用于简单的隐藏语句：$refreshregionalstructure.hide；我的意思是说没有ajax请求发生。我已经接受了这个答案，因为你为它工作，谢谢。最后，我使用了这个插件，这是一个更完整的解决方案