Question

我有以下搜索功能的javascript代码。它本身在html / php文件中编写时效果很好，但是，当我尝试在我的jQuery文件中添加它时，它不再起作用了。

<script type="text/javascript">     
    function findmatch(){
        if(window.XMLHttpRequest){
            xmlhttp = new XMLHttpRequest();
        } else {
            xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
        }


        xmlhttp.onreadystatechange = function(){
            if ( xmlhttp.readyState == 4 && xmlhttp.status == 200 ){
                    document.getElementById('search_result').innerHTML = xmlhttp.responseText;                
            }
        }

        xmlhttp.open('GET', 'php/search.php?search_text='+document.search.search_text.value , true);
        xmlhttp.send();

    }
 </script>

我尝试用$（'＃'）替换'getElementById'并且很少用。但没有奏效。我想在jQuery中转换，以便根据返回的结果大小管理/动画'search_result'div。我不知道我该怎么做。但是，如果你可以指导我更多，那将是伟大的/

Answer 1

尝试这个

function findmatch(){
    $.ajax({
        type : "GET",
        url : 'php/search.php?search_text='+document.search.search_text.value,
        cache : false,
        async : false,
        success : function(data) {
            $('#search_result').text(data);
        },
        error : function(jqXHR, textStatus, errorThrown) {
            alert(errorThrown);
        }
    });

}

Answer 2

如果我理解正确，那就是Ajax调用：

<html>
  <head>
    <script src="jqueryLibrary.js"></script>
    <script type="text/javascript">
       function findmatch() {
          $.ajax({
             url: 'php/search.php?search_text=' + document.search.search_text.value,
             type: 'get',
             success: function(responseText){
               $('#search_result').text(responseText);
             }
          })
       }
    </script>
  </head>
</html>

Answer 3

所以这应该有效：

function findmatch() {
    $.post('php/search.php?search_text='+document.search.search_text.value,function(response){
        $('#search_result').html(response);
    });
}

//编辑：在函数findmatch（）{}之后犯了一个错误，semikolon ＆LT;＆LT;

问候

将javascript代码转换为jquery

3 个答案: