将常规Javascript转换为jQuery

Question

我有一些代码涉及单击按钮,您要么已登录,要么转到下一页,否则您将退出并收到提醒.我从来没有喜欢onClickHTML内部,所以我想把它转变为点击id并让jQuery发挥其魔力.

我理解jQuery的click函数,但我不知道如何放下do_bid(".$val["id"].");Javascript的其余部分.如果我没有提供足够的信息或者有官方资源,请告诉我.

<li class='btn bid' onclick='do_bid(".$val["id"].");'> Bid </li>

<script>
    //Some other Javascript above this
    function do_bid(aid)
    {
        var loged_in = "<?= $_SESSION["BPLowbidAuction_LOGGED_IN"] ?>";
        if(loged_in=="")
        {
            alert('You must log in to bid!');
        }
        else
        {
            document.location.href="item.php?id="+aid;
        }
    }
</script>

更新:这是整个Javascript代码.我认为到目前为止没有一个答案是有效的,因为答案不符合我的其余Javascript.我希望这有帮助

<script language="JavaScript">
    $(document).ready(function(){
function calcage(secs, num1, num2) {
s = ((Math.floor(secs/num1))%num2).toString();
if (LeadingZero && s.length < 2)
s = "0" + s;
return "" + s + "";
}
function CountBack() {
<?
for($i=0; $i<$total_elements; $i++){
echo "myTimeArray[".$i."] = myTimeArray[".$i."] + CountStepper;";
}
for($i=0; $i<$total_elements; $i++){
echo "secs = myTimeArray[".$i."];";
echo "DisplayStr = DisplayFormat.replace(/%%D%%/g, calcage(secs,86400,1000000));";
echo "DisplayStr = DisplayStr.replace(/%%H%%/g, calcage(secs,3600,24));";
echo "DisplayStr = DisplayStr.replace(/%%M%%/g, calcage(secs,60,60));";
echo "DisplayStr = DisplayStr.replace(/%%S%%/g, calcage(secs,1,60));";
echo "if(secs < 0){
if(document.getElementById('el_type_".$i."').value == '1'){
document.getElementById('el_".$i."').innerHTML = FinishMessage1;
}else{
document.getElementById('el_".$i."').innerHTML = FinishMessage2;";
echo "  }";
echo "}else{";
echo " document.getElementById('el_".$i."').innerHTML = DisplayStr;";
echo "}";
}
?>
if (CountActive) setTimeout("CountBack()", SetTimeOutPeriod);
}
function putspan(backcolor, forecolor, id) {
document.write("<span id='"+ id +"' style='background-color:" + backcolor + "; color:" + forecolor + "'></span>");
}
if (typeof(BackColor)=="undefined")     BackColor = "white";
if (typeof(ForeColor)=="undefined")     ForeColor= "black";
if (typeof(TargetDate)=="undefined")    TargetDate = "12/31/2020 5:00 AM";
if (typeof(DisplayFormat)=="undefined") DisplayFormat = "%%D%%d, %%H%%h, %%M%%m, %%S%%s.";
if (typeof(CountActive)=="undefined")   CountActive = true;
if (typeof(FinishMessage)=="undefined") FinishMessage = "";
if (typeof(CountStepper)!="number")     CountStepper = -1;
if (typeof(LeadingZero)=="undefined")   LeadingZero = true;
CountStepper = Math.ceil(CountStepper);
if (CountStepper == 0) CountActive = false;
var SetTimeOutPeriod = (Math.abs(CountStepper)-1)*1000 + 990;
var myTimeArray = new Array();
<?  for($i=0; $i<$total_elements; $i++){?>
ddiff=document.getElementById('el_sec_'+<?=$i;?>).value;
myTimeArray[<?=$i;?>]=Number(ddiff);
<? } ?>
CountBack();
           function do_bid(aid)
    {
        var loged_in = "<?= $_SESSION["BPLowbidAuction_LOGGED_IN"] ?>";
        if(loged_in=="")
        {
            alert('You must log in to bid!');
        }
        else
        {
            document.location.href="item.php?id="+aid;
        }
    }
}</script>

Answer 1

如果要click使用jQuery 附加事件处理程序.您需要首先在页面中包含jQuery库,然后尝试以下代码.

您不应该在元素中有2个类属性.将btn和bid类同时移动到一个类属性中.

标记更改.在这里,我将会话变量呈现为一个数据属性,以便稍后在click事件处理程序中使用jQuery data方法.

PHP/HTML:

echo "<li class='btn bid' data-bid='".$val["id"]."'>Bid</li>";

JS:

$('.btn.bid').click(function(){
    do_bid($(this).data('bid'));
});

如果您不想使用data属性并将id呈现为JS变量,那么您可以使用以下代码.

var loged_in = "<?= $_SESSION["BPLowbidAuction_LOGGED_IN"] ?>";
$('.btn.bid').click(function(){
     if(!loged_in){ 
         alert('You must log in to bid!'); 
     }
     else{
         do_bid(loged_in); 
     }
});