用jQuery ajax响应html更新div

我正在尝试从ajax html响应的内容更新div。 我相信我有正确的语法，但div内容被replace为整个HTML页面响应，而不是在HTML响应中select的div。 我究竟做错了什么？

<script> $('#submitform').click(function() { $.ajax({ url: "getinfo.asp", data: { txtsearch: $('#appendedInputButton').val() }, type: "GET", dataType : "html", success: function( data ) { $('#showresults').replaceWith($('#showresults').html(data)); }, error: function( xhr, status ) { alert( "Sorry, there was a problem!" ); }, complete: function( xhr, status ) { //$('#showresults').slideDown('slow') } }); }); </script> 

Answer 1

你正在设置任何data的#showresults的html，然后用自己replace它，这没有多大意义？
我猜你在哪里真的试图在返回的数据中find#showresults ，然后用来自ajax调用的html中的html更新DOM中的#showresults元素：

 $('#submitform').click(function () { $.ajax({ url: "getinfo.asp", data: { txtsearch: $('#appendedInputButton').val() }, type: "GET", dataType: "html", success: function (data) { var result = $('<div />').append(data).find('#showresults').html(); $('#showresults').html(result); }, error: function (xhr, status) { alert("Sorry, there was a problem!"); }, complete: function (xhr, status) { //$('#showresults').slideDown('slow') } }); }); 

Answer 2

也可以使用jQuery的.load（）

 $('#submitform').click(function() { $('#showresults').load('getinfo.asp #showresults', { txtsearch: $('#appendedInputButton').val() }, function() { // alert('Load was performed.') // $('#showresults').slideDown('slow') }); }); 

不像$ .get（），允许我们指定要插入的远程文档的一部分。 这是通过url参数的特殊语法实现的。 如果string中包含一个或多个空格字符，则第一个空格后面的string部分将被假定为一个jQueryselect器，用于确定要加载的内容。

我们可以修改上面的例子，只使用被抓取文档的一部分：

 $( "#result" ).load( "ajax/test.html #container" ); 

当这个方法执行时，它检索ajax / test.html的内容，但是jQueryparsing返回的文档以find具有容器ID的元素。 这个元素及其内容被插入到带有结果ID的元素中，其余的被检索的文档被丢弃。