Javascript检查变量为null,显示结果

时间:2018-02-01 19:34:53

标签: javascript jquery

我有一个按钮的JavaScript函数。单击该按钮时,将显示信息。我试图检查当前设置中是否没有结果,然后转到下一组结果。

$("#mybutton").on("click", function() { 
    var $rowsNo = $("#table tbody tr").hide().filter(function () {
        var $checkresults =  $.trim($(this).find("td").eq(0).text()) === "1";

        if ($checkresults  != null){
            return $.trim($(this).find("td").eq(0).text()) === "1"
        } else
            return $.trim($(this).find("td").eq(0).text()) === "2"
    }).show();
});

此解决方案似乎仍然只捕获第一个选项并显示空数据。有没有更好的方法来处理这种情况?

1 个答案:

答案 0 :(得分:2)

以下是使用data-*属性和jQuery的.data()方法

的示例



var $rows = $("#table tbody tr");

$("[data-showrow]").on("click", function() {

  var showrow = $(this).data("showrow"); // Get the data value: "", "1", "2" etc
  if (!showrow) return $rows.show();     // if "" was clicked, show all and exit.

  $rows.hide().filter(function(){
    return $(this).find("td").eq(0).text() == showrow;
  }).show();
  
});

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button data-showrow="">All</button>
<button data-showrow="1">1</button>
<button data-showrow="2">2</button>
<button data-showrow="3">3</button>


<table id="table">
  <tbody>
    <tr><td>1</td> <td>Lorem</td></tr>
    <tr><td>2</td> <td>Ipsum</td></tr>
    <tr><td>1</td> <td>Dolor</td></tr>
    <tr><td>1</td> <td>Sit</td></tr>
    <tr><td>2</td> <td>Amet</td></tr>
    <tr><td>3</td> <td>consectetur </td></tr>
    <tr><td>1</td> <td>Adipiscing</td></tr>
  </tbody>
</table>
&#13;
&#13;
&#13;