我的页面有两列第1列用于播放程序1，第2列 通过一些ajax en php代码，我返回每个玩家的以下信息。例如： Col1：汤姆，足球：8分篮球：5分 Col2：乔纳森，足球：4分篮球：9分 现在我想让用户对结果进行排序：所以我在每列中添加另一个下拉列表： PHP AJAX 如您所见，下拉列表使用user_id和选项值对结果进行排序。 这段代码只适用于1列，因为他保持（Ofcourse）使用第一个user_id。例如，当我尝试对第二个结果进行排序时，他会对第一个user_id（Normal）的结果进行排序。 我希望SORT DROPDOWN使用user_id的玩家在同一列中被选中。 重要 我想在页面上显示两个结果后使用排序选项。echo "<select id='filter_class' name='"filter'"
data-userid='"".$user_id."'" onchange='"getFilter(this.value)'">
<option value='"all'">All</option>
<option value='"asc'">Asc</option>
<option value='"desc'">Desc</option>
</select>";
function getFilter(filter)
{
var user_id = document.getElementById('filter_class').getAttribute('data-userid');
console.log(user_id);
$.ajax({
type: "GET",
url: 'http://website.com',
data: {action: filter, user_id: user_id},
success: function (result) {
$("#Target").html(result);
}
});
}
您需要使用不同的id创建SORT下拉列表。假设您有id的id='filter_class1'和id='filter_class2'。
现在，您需要将调用下拉列表的id传递给getFilter()函数，如下所示。
onchange='"getFilter(this.value, this.id)'"
getFilter()函数的前几行应该是这样的：
function getFilter(filter, eleId)
{
var user_id = document.getElementById(eleId).getAttribute('data-userid');
console.log(user_id);
...
只有一个元素具有一个id。
您可能希望在使用data属性的同时使用class属性。使用jquery的类选择器。
看看这个例子。
<select class='filter_class' name="filter"
data-userid="29" >
<option value="all">All</option>
<option value="asc">Asc</option>
<option value="desc">Desc</option>
</select>
<select class='filter_class' name="filter"
data-userid="30" >
<option value="all">All</option>
<option value="asc">Asc</option>
<option value="desc">Desc</option>
</select>
<script>
$(".filter_class").change(function(){
var user_id = $(this).data('userid');
alert(user_id);
})
</script>