javascript - 在页面加载时触发/绑定文本框的 jquery 事件
问题描述
当用户输入邮政编码并单击下一步添加更多详细信息时,我在 view1 中有一个邮政编码文本框,我将邮政编码从 view1 传递到 view2。在 view2 中,我需要根据输入的邮政编码显示州和城市。我已经使用 keyup 根据输入的 zip 获取城市和州。当我在 view2 中更改邮政编码时它工作正常。但是当我从 view1 到 view2 时它不起作用。我需要在页面加载时触发邮政编码文本框的事件,我的意思是当邮政编码从 view1 传递到 view2 时。现在,当我从 view1 到 view2 时,仅在其各自的文本框中显示邮政编码,而城市和州字段不显示任何内容。如何触发邮政编码文本框的事件或绑定到页面加载时的现有事件?
$(document).ready(function ()
{
$("#zip").keyup(function () {
var el = $(this);
if (el.val().length === 5) {
$.ajax({
type:'GET',
dataType: "json",
cache: true,
url: "../api/Getstatelist/" + el.val(),
success: function (html) {
$.each(html,function(key,value){
$('#state').append($('<option></option>').val(value.State).html(value.State));
});
$.each(html,function(key,value){
$('#city').append($('<option></option>').val(value.City).html(value.City));
});
}
});
}
});
});
<div>
<div class="city-wrap">
<select id="city">
<option value="">Select City first</option>
</select>
<label for="city">City</label>
</div>
<div class="state-wrap">
<select id="state">
<option value="">Select State </option>
</select>
<label for="state">State</label>
</div>
<div class="zip-wrap">
@Html.TextBoxFor(model => model.Zip, new { @class = "form-control", @id = "zip", @name = "zip" })
<label for="zip">Zip</label>
</div>
</div>
解决方案
我想出了解决方案。添加了加载功能,如下所示。我不确定这是不是正确的做法。任何的意见都将会有帮助。
$( window ).on( "load", function() {
var val = $('#zip').val();
if (val.length === 5) {
$.ajax({
type:'GET',
dataType: "json",
cache: true,
url: "../api/Getstatelist/" + val,
success: function (html) {
$.each(html,function(key,value){
$('#state').append($('<option></option>').val(value.State).html(value.State));
});
$.each(html,function(key,value){
$('#city').append($('<option></option>').val(value.City).html(value.City));
});
}
});
}
}
推荐阅读
- scheduled-tasks - Flink 的任务调度问题,在 Flink 中,如何将子任务放置到指定任务管理器的某个 slot 中?
- swiftui - 为什么在swiftUI中颜色视图是透明的
- javascript - Laravel 输入类型搜索取消按钮提交表单
- wiremock - Wiremock 验证 - 如何将请求与时间参数匹配
- python-3.x - 如何在 mac 触摸栏中显示 tkinter 按钮
- r - 根据数据帧中各行的目标向量计算字符串匹配
- reactjs - React 延迟加载 useEffect
- flutter - 更改颤振原生闪屏包中的图像大小
- c# - Invision Api 论坛/论坛
- c++ - 如何正确链接 cppgit2 库