Javascript 如何在脚本中添加2个jquery事件？

我有两个jquery事件，它们在脚本标记中异步调用

然而，只有第一个有效

代码：

<script>
    $('#type').bind('change', function (e) 
        {
            $.getJSON('<?php echo $this->baseURL()?>/this/url/go/' + encodeURIComponent($('#type').val()),
            function(data) 
            {
                $("#more").html(data.form);
            }
            );
    });

    $( "#search" ).autocomplete({
          source: function(request, response)
          {
            $.ajax({
                url: 'this/new/url/' + request.term,
                dataType: 'json',
                success: function(data)
                {
                    response(data);
                }  
            })
          },
          minLength:2
        });
</script>

<form enctype="application/x-www-form-urlencoded" action="" method="post">
<dl class="zend_form">
<dt id="type-label"><label for="type" class="optional">Select a Type:</label>
</dt>
<dd id="type-element">
<select name="type" id="type">
    <option value="various" label="options etc">Annual Report</option>
</select></dd></dl></form>
<div id='more'>
</div>

$（'#type'）.bind（'change'，function（e）
{
$.getJSON（'/this/url/go/'+encodeURIComponent（$（'#type'）.val（）），
功能（数据）
{
$（“#更多”）.html（data.form）；
}
);
});
$（“#搜索”）.autocomplete({
来源：功能（请求、响应）
{
$.ajax({
url:'this/new/url/'+request.term，
数据类型：“json”，
成功：功能（数据）
{
答复（数据）；
}  
})
},
最小长度：2
});

只有第一个函数起作用，我还测试了它，只有底部脚本在那里，它起作用了

我犯了什么错误

HTML:

<script>
    $('#type').bind('change', function (e) 
        {
            $.getJSON('<?php echo $this->baseURL()?>/this/url/go/' + encodeURIComponent($('#type').val()),
            function(data) 
            {
                $("#more").html(data.form);
            }
            );
    });

    $( "#search" ).autocomplete({
          source: function(request, response)
          {
            $.ajax({
                url: 'this/new/url/' + request.term,
                dataType: 'json',
                success: function(data)
                {
                    response(data);
                }  
            })
          },
          minLength:2
        });
</script>

<form enctype="application/x-www-form-urlencoded" action="" method="post">
<dl class="zend_form">
<dt id="type-label"><label for="type" class="optional">Select a Type:</label>
</dt>
<dd id="type-element">
<select name="type" id="type">
    <option value="various" label="options etc">Annual Report</option>
</select></dd></dl></form>
<div id='more'>
</div>

选择一种类型：
年度报告

然后使用ajax添加以下内容：

<form enctype="application/x-www-form-urlencoded" action="" method="post"><dl class="zend_form">
<dt id="search-label"><label for="search" class="optional">Search Code:</label></dt>
<dd id="search-element">
<input type="text" name="search" id="search" value=""></dd></dl></form>

搜索代码：

按如下方式编写代码

首先添加jquery文件

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

然后

$（文档）.ready（函数（）{
//你的代码
$（'#type'）.bind（'change'，function（e）
{
$.getJSON（'/this/url/go/'+encodeURIComponent（$（'#type'）.val（）），
功能（数据）
{
$（“#更多”）.html（data.form）；
}
);
});
$（“#搜索”）.autocomplete({
来源：功能（请求、响应）
{
$.ajax({
url:'this/new/url/'+request.term，
数据类型：“json”，
成功：功能（数据）
{
答复（数据）；
}  
})
},
最小长度：2
});
})

这对

bind

和

autocomplete

都能正常工作，请参见此

稍后加载

search

元素时，必须移动

$("#search").autocomplete(...);

---

在代码后面调用，在代码后面创建或加载搜索元素。

尝试使用On（如果您使用Jquery 1.8或更高版本）或live（低于Jquery 1.7）方法包装您的方法

$（body）.on（'change'，'type'，函数（e）{
（'/this/url/go/'+encodeURIComponent（$（'#type'）.val（）），
功能（数据）
{
$（“#更多”）.html（data.form）；
}
);
});
$（正文）.on（'focus'，'search'，函数（e）
{
$（“#搜索”）.autocomplete({
来源：功能（请求、响应）
{
$.ajax({
url:'this/new/url/'+request.term，
数据类型：“json”，
成功：功能（数据）
{
答复（数据）；
}  
})
},
最小长度：2
});
});

同时显示HTML。第一次加载页面或使用ajax加载页面时，

search

和

type

可用吗？使用ajax Muralit加载搜索然后移动

$（“#search”）.autocomplete（{

函数在设置.html（数据）后返回ajax成功）抱歉@rituraj，我没有提到

search

DOM元素是用ajax加载的，因此当页面最初加载

live

时，它不在那里，甚至低于1.7。如果无法升级，请使用

delegate

。即使滚动您自己的委派也比

live

好。