加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 站长学院 > PHP教程 > 正文

php – 为什么用AJAX加载html后jQuery更改函数不起作用?

发布时间:2020-12-13 13:50:59 所属栏目:PHP教程 来源:网络整理
导读:我加载一个表单并从 PHP文件中通过AJAX动态填充select.在实现动态AJAX填充选择之前,我的更改功能正常工作(当用户选择“其他”时,它只显示另一个输入).现在更改功能不起作用. 我知道ready函数正在触发,因为jStepper函数运行.我已尝试使用ready函数内外的更改
我加载一个表单并从 PHP文件中通过AJAX动态填充select.在实现动态AJAX填充选择之前,我的更改功能正常工作(当用户选择“其他”时,它只显示另一个输入).现在更改功能不起作用.

我知道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.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读