在文档就绪时触发jQuery更改函数
我的更改function允许用户从一个国家切换到另一个国家，并获得不同的文字和function。 它在更改国家/地区选择时有效。 但是在初始页面加载时，它不会触发jQuery更改来设置隐藏和显示默认/初始国家/地区的文本div。
两个div都显示在初始页面加载时。 当我改变然后回到默认/初始国家时，更改火灾，隐藏和显示火灾，并显示正确的信息和function。
我已经在开关选择内部和更改function外部尝试了document.ready和更改function。 两者都没有工作 – 他们不会在doc准备好的交换机案例中激活hide，show和其他jQuery。 我不清楚“准备好”是否是一个有效的触发事件。
我也尝试过：
$('input[name=country]').value('US').trigger('click');
但它打破了改变function。 这是代码。 下面的国家选择仅仅是2个国家，以保持简单，但实际上，有很多。
$(document).ready(function() { //1st tier - select country via radio buttons: //Initialize country $('input[name=country]:first').attr('checked', true); //Set first radio button (United States) //$('input[name=country]:first').attr('checked', true).trigger('ready'); //sets 1st button, but does not fire change //$('input[name=country]:first').trigger('click'); //sets 1st button, but does not fire change $('input[name=country]').change(function () { // change user instructions to be country specific switch ($('input[name=country]:checked').val()) { case 'US': $('#stateMessage1').text('2. Select a state or territory of the United States.'); $('#stateMessage2').text('Start typing a state of the United States, then click on it in the dropdown box.'); $('#threeSelects').show(); $('#twoSelects').hide(); //select via 3 steps break; case 'CA': $('#stateMessage1').text('2. Select a province or territory of Canada.'); $('#stateMessage2').text('Start typing a province of Canada, then click on it in the dropdown box.'); $('#twoSelects').show(); $('#threeSelects').hide(); //select town via 2 steps - country, town break; } }); });
只需将.trigger('change')到处理程序赋值的末尾即可。
// ----------v-------v-----quotation marks are mandatory $('input[name="country"]').change(function () { // change user instructions to be country specific switch ($('input[name="country"]:checked').val()) { case 'US': $('#stateMessage1').text('2. Select a state or territory of the United States.'); $('#stateMessage2').text('Start typing a state of the United States, then click on it in the dropdown box.'); $('#threeSelects').show(); $('#twoSelects').hide(); //select via 3 steps break; case 'CA': $('#stateMessage1').text('2. Select a province or territory of Canada.'); $('#stateMessage2').text('Start typing a province of Canada, then click on it in the dropdown box.'); $('#twoSelects').show(); $('#threeSelects').hide(); //select town via 2 steps - country, town break; } }).trigger('change'); // <--- RIGHT HERE
或者，如果您只想在第一个元素上触发它，请改用triggerHandler() 。
// ... $('#twoSelects').show(); $('#threeSelects').hide(); //select town via 2 steps - country, town break; } }).triggerHandler('change'); // <--- RIGHT HERE
为什么不在选择合适的单选按钮后触发change ？
$('input[name=country]').change();
这相当于
$('input[name=country]').trigger('change');
在最后}）;之前，添加$（’input’）。change（）;
这通常是：
function onChange () { switch ($('input[name=country]:checked').val()) .... } $('input[name=country]').change(onChange); // 1. attach it as event handler. onChange(); // 2. call it first time.