我有一个按钮的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();
});
此解决方案似乎仍然只捕获第一个选项并显示空数据。有没有更好的方法来处理这种情况?
答案 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;