我知道ready函数正在触发,因为jStepper函数运行.我已尝试使用ready函数内外的更改函数.我觉得在AJAX get完成之前加载了更改函数,但这真的很重要吗?
var types = "<select name='ve_categoryNo' id='ve_categoryNo'>"; var d = new Date(); $.get('scripts/vehicle_category_Feed.PHP?date=' + d.getTime(),function ($type) { $($type).find('type').each(function () { types += "<option value='" + $(this).attr("categoryno") + "'>" + $(this).attr("category") + "</option>"; }); types += "<option value='other'>Other(Specify)</option></select>"; $('#ve_categoryNo_td').html(types); }); $(document).ready(function () { $('input[type=text]').click(function () { $(this).select(); }); $('#vehicle_entry').ajaxForm(function () { showMessage('vehicle_information_added'); }); $('#ve_ariNo').jStepper({minValue: 1,maxValue: 99999999}); $('#ve_fleetNo').jStepper({minValue: 1,maxValue: 999999999}); $('#ve_vehicleYear').jStepper(); $('#ve_purchasePrice').jStepper({minValue: 0}); $('#ve_categoryNo').change(function () { if ((this.value) == "other") { $('#otherCategory').show(); $('#otherCategory input[type=text]').focus(); } else { $('#otherCategory').hide(); } }); });
$('#ve_categoryNo').change(function() {
至
$(document).on('change','#ve_categoryNo',function() {
编辑3:在更仔细地检查您的代码之后,这将表现最佳:
$('#ve_categoryNo_td').on('change',function() {
因为它最接近所讨论的元素.
您还应该将ajax调用放在我认为准备好的脚本中.
发生这种情况的原因是DOM在实例化时没有任何东西可以绑定到它.以这种方式使用.on将其绑定到文档.如果你有另一个包含它的“固定”元素,那么使用它来代替“文档”绑定可能会更好,因为它可能会表现得更好.
编辑:请注意,在将元素作为ajax调用完成的一部分注入后,您也可以添加更改事件管理,但如果您多次执行此操作,则应在此情况下首先解除绑定.
EDIT2:既然有问题/意见:
来自文件:http://api.jquery.com/on/
Attaching many delegated event handlers near the top of the document tree can degrade performance. Each time the event occurs,jQuery must compare all selectors of all attached events of that type to every element in the path from the event target up to the top of the document. For best performance,attach delegated events at a document location as close as possible to the target elements. Avoid excessive use of document or document.body for delegated events on large documents.