我有一个寄存器.php页面,它从数据库中提取数据。我在我的php页面上列出了结果,并且我已经从列标题创建了用于对列进行排序的链接。
链接如下所示
<div class='col-sm-12 day-heading'>
<div class="row">
<div class="col-sm-2"><a id="student_forename" onClick="showUser('student_forename','ASC')">Forename</a></div>
<div class="col-sm-2"><a id="student_surname" onClick="showUser('student_surname','ASC')">Surname</a></div>
<div class="col-sm-2"><a id="club" onClick="showUser('club','ASC')">Club</a></div>
<div class="col-sm-3"><a id="student_instructor" onClick="showUser('student_instructor','ASC')">Instructor</a></div>
<div class="col-sm-2"><a id="date_awarded" onClick="showUser('date_awarded','ASC')">Date</a></div>
<div class="col-sm-1"><a id="student_age" onClick="showUser('student_age','ASC')">Age</a></div>
</div>
显示用户功能是
<script type="text/javascript">
function showUser(test, order)
{
var users = document.getElementById('instructor').value;
var sex = document.getElementById('club').value
//var sort = document.getElementById('sortby').value;
var sort = test;
const but = document.getElementById(test);
if(but.getAttribute("onClick") === "showUser(test,'DESC')")
{
but.setAttribute("onClick","showUser(test,'ASC')");
}
else
{
but.setAttribute("onClick","showUser(test,'DESC')");
}
var order = order;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajaxcall.php?student_instructor="+users+"&club="+sex+"&sortby="+sort+"&orderby="+order,true);
xmlhttp.send();
}
我认为问题在于尝试使用传递给其中函数的变量值。 例如这条线
const but = document.getElementById(test);
例如,应该将测试替换为从onClick链接传递的值
const but = document.getElementById(student_forename);
但是我在上面的代码中是否正确使用了测试?
同样同样
if(but.getAttribute("onClick") === "showUser(test,'DESC')")
test应替换为"test"的值,而不是设置为测试。
希望这是有意义的:)
脏方法: 您可以将一个类添加到您的标签 initialy class="asc" 中,当单击 u 检查类是否存在并设置 "let order= asc"
并从标签中删除类 接下来
单击检查类是否存在,如果不存在,则设置 "let order= desc" 并添加 class="asc"。
您可以轻松切换类和变量
在这种情况下,您不必将顺序参数传递给您的函数,
您也可以切换onClick函数:
<a onClick="showUser('student_forename','ASC')">Forename</a>
<a onClick="showUser('student_forename','DESC')">Forename</a>
使用 JS
你可能会写这样的东西:
<button id="but" class="ASC" onClick="showUser('student_forename','DESC')">BUTTON
</button>
<script>
function showUser(test, order)
{
const but = document.getElementById('but');
if(but.getAttribute("onClick") === "showUser('student_forename','DESC')")
{
but.setAttribute("onClick","showUser('student_forename','ASC')");
}
else
{
but.setAttribute("onClick","showUser('student_forename','DESC')");
}
order = order;
test = test;
console.log(`order= ${order}`);
console.log(`test= ${test}`);
}
</script>
后来在功能体中做任何你想做的事:)
我添加了 2 个控制台.log以检查我是否将值传递给函数