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

前端之家收集整理的这篇文章主要介绍了php – 为什么用AJAX加载html后jQuery更改函数不起作用?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
@H_404_0@ 我加载一个表单并从 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.

猜你在找的PHP相关文章