解析ajax成功函数接收到的数据的更简洁/更好的方法是什么?


What is a cleaner / better way of parsing data received by an ajax success function?

我使用一个ajax函数来接收数据。根据这些数据,如果没有找到结果,我将收到一个带有一些html格式的字符串"No matches found"。如果有结果,则将数据格式化为表格,并隐藏该部分下面的"Div"部分。

现在我遇到的问题是,当我发现没有结果时,我不希望这个"Div"表消失。但是为了检查是否没有结果,我必须比较searchCustomer.php接收到的整个字符串(它非常大)。

有更简单的方法吗?

我的ajax调用:

$('#search').click(function(e){
        $.ajax({
            type : 'GET',
            url : 'searchCustomer.php',
            dataType :'html',
            data:{
                lastName : $('#search_LN').val(),
                firstName : $('#search_FN').val(),
                phone : $('#search_PN').val()
            },
            success : function(data){
                if (data.error == true){
                    alert("there was an error in the post layer");
                } else {
                    $('#searchResults').html(data);

                if (data.text == '<br><font color='red'>No matches found</font>'){
                }else{
                var ele = document.getElementById("NewCustomerDiv");
                ele.style.display = "none";
                }
            }
        }
    });
    return false;
});

fire-bug运行,从searchCustomer.php接收到的实际数据是:

<style type="text/css">
a.resultBookButton {
    color: black;
    padding: 1px;
    border: 2px outset lightgrey;
    background: #008800;
    /* Mozilla: */
    background: -moz-linear-gradient(top, lightgrey, #FFFFFF);
    /* Chrome, Safari:*/
    background: -webkit-gradient(linear,
                left top, left bottom, from(lightgrey), to(#FFFFFF));
    text-decoration: none;
}
a:active {
    border-style: inset;
}
</style>
<br><font color='red'>No matches found</font>

我只是想检查"没有找到匹配",或者是否有更好的方法找到没有结果。

是的,返回JSON代替。您可以将响应结构为:

{
  count: 0,
  content: "your html here"
}

然后可以通过data.count检查计数。您的服务器将需要根据找到的结果数量设置此值。

您需要将ajax调用中的dataType属性设置为JSON

我不同意Brad的观点,转换为JSON将是一种痛苦,因为所有使用引号的HTML都必须将这些引号转义才能在JSON字符串中工作,这充其量是一种烦恼,最坏的情况是意外触发无效JSON的错误。

理想的解决方案是改变这些页面返回的内容。如果找到项目,返回完整的HTML,如果没有找到,返回"0"或",然后检查这些返回。

如果您不能更改AJAX调用返回的内容,也许只需执行(returnedData.indexOf("

容易peasy。

编辑:

$.ajax({
      ... other setting ...
        success : function(data){
           (data.indexOf('<table') == -1){
                //there was a table in the returned data
           } else {
                // ...
           }
        }
      });

AJAX响应应该包含易于解析的格式(如JSON或XML)的原始数据。在接收到响应后,AJAX成功处理程序应该解析响应并生成要显示的必要HTML。searchCustomer.php不应该生成HTML…你的成功处理程序应该。

如果以这种方式设计,它就给了你显示数据的灵活性,所以你可以在你的网站的任何地方重用这个AJAX函数(甚至让它公开供互联网上的其他人使用)。

JSON:

{
  results: [
    "result1",
    "result2"
  ]
}
XML:

<results>
  <result>result1</result>
  <result>result2</result>
</results>