試圖讓鼠標控件在JQuery中使用.on（點擊）

-1

我想添加用於導航到我的遊戲的鼠標控件。我在屏幕上創建了一些按鈕，如下所示：試圖讓鼠標控件在JQuery中使用.on（點擊）

<input type="image" id= "buttonUp" src="UpButton.jpg" alt="Up" style="position:absolute; left: 200px; top: 550px;"> 
<input type="image" id= "buttonDown" src="DownButton.jpg" alt="Down" style="position:absolute; left: 200px; top: 650px;"> 
<input type="image" id= "buttonLeft" src="LeftButton.jpg" alt="Left" style="position:absolute; left: 100px; top: 650px;"> 
<input type="image" id= "buttonRight" src="RightButton.jpg" alt="Right" style="position:absolute; left: 300px; top: 650px;">

每一個顯然對應於每個移動方向。然後從那裏我試圖讓他們觸發點擊時：

$('.buttonUp').on('click', function() { 
    direction == "up"; 
}); 
$('.buttonDown').on('click', function() { 
    direction == "down"; 
});  
$('.buttonLeft').on('click', function() { 
    direction == "left"; 
});  
$('.buttonRight').on('click', function() { 
    direction == "right"; 
});

但它不會做任何事情時單擊。我怎樣才能解決這個問題？

來源

2017-05-05 JonRogerson

首先你使用類選擇，當你的元素有ID。將'.'更改爲'＃'。然後你需要使用'='來設置一個變量。 '=='用於檢查相等性。但是，即使只是設置一個變量，你期望它做什麼？你的代碼似乎沒有做別的。 –

您正在通過'class'分配事件，但輸入元素沒有。你應該用ID來做，比如'$（'＃buttonUp'）'。 – doutriforce

而您正在使用比較來設置值。永遠不會工作。使用=而不是== – Snowmonkey

爲了給變量賦值，你必須使用一個equals符號，而不是像你在代碼中那樣做兩個符號來比較值。將所有==更改爲=。

而且使用的是類選擇.，但你應該使用id選擇#

來源

2017-05-05 19:12:58 Lixus

假設你的方向邏輯已經被編碼，你必須改變==到=。 ==僅供比較。使用=將值等於direction。

而且，您在HTML代碼中使用了ID，但是在腳本中使用了類選擇器。

來源

2017-05-05 19:13:07 mehulmpt

現在，您正在以各種方式複製代碼。您正在使用類選擇器來通過id獲取元素。並且您正在使用相等比較來嘗試設置值。相反，我有一個連接到所有控件的函數，並使用控件的alt值設置方向。見下文。

var direction; 
 
$('.control-btn').on('click', function() 
 
    { 
 
     direction = $(this).attr("alt").toLowerCase(); 
 
     console.log(direction); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="image" id= "buttonUp" class="control-btn" src="UpButton.jpg" alt="Up" style="position:absolute; left: 200px; top: 50px;"> 
 
    <input type="image" id= "buttonDown" class="control-btn" src="DownButton.jpg" alt="Down" style="position:absolute; left: 200px; top: 150px;"> 
 
    <input type="image" id= "buttonLeft" class="control-btn" src="LeftButton.jpg" alt="Left" style="position:absolute; left: 100px; top: 150px;"> 
 
    <input type="image" id= "buttonRight" class="control-btn" src="RightButton.jpg" alt="Right" style="position:absolute; left: 300px; top: 150px;">

來源

2017-05-05 19:18:13 Snowmonkey

試圖讓鼠標控件在JQuery中使用.on（點擊）

回答

相關問題