2013-09-09 2 views
0

У меня есть сценарий, который принимает значение входных тегов при событии клика, и мне нужно сравнить их, чтобы узнать, являются ли они одинаковыми значениями. Я все еще изучаю Javascript и JQuery, поэтому мне действительно нужно найти какую-то помощь. Вот мой код:Сравнение переменных в Javascript

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 
<script> 
$(document).ready(function(){ 
$("#swapCard_0").click(function(){ 

var phpval = document.getElementById('swapCard_0').value; 

}); 

$("#swapCard_1").click(function(){ 


var phpval = document.getElementById('swapCard_1').value; 
}); 

$("#swapCard_2").click(function(){ 


var phpval = document.getElementById('swapCard_2').value; 
}); 
$("#swapCard_3").click(function(){ 


var phpval = document.getElementById('swapCard_3').value; 
}); 
}); 
</script> 

</head> 
<body> 

<input type="image" id="swapCard_0" src="image/image0.jpg" value="0"> 
<input type="image" id="swapCard_1" src="image/image1.jpg" value="1"> 
<input type="image" id="swapCard_2" src="image/image2.jpg" value="0"> 
<input type="image" id="swapCard_3" src="image/image3.jpg" value="1"> 
</body> 
</html> 

Так что пользователь нажимает на изображение 0, а затем щелкает изображение 2, которые оба имеют значение 0, то как я могу сравнить их в функции затем выполнить больше коды? Я уверен, что мне понадобится инструкция if, но я не уверен, как правильно ее проверить в моем коде. Я хотел бы воспроизвести звук, когда пользователь нажимает на два разных изображения с одинаковым значением.

+0

Используйте оператор '===' для сравнения двух переменных. Объявите 'phpval' как глобальный и на клике, если phpval не является нулевым, и если у него есть '===' тот же val, что и phpval. –

ответ

1

У вас может быть глобальная переменная и задать ее, когда пользователь нажимает на первое изображение, подобное этому.

  $(document).ready(function(){ 

      var selectedImageValue; 
      $("#swapCard_0").click(function(){    
       CheckValue($(this).val()); 
      }); 

      $("#swapCard_1").click(function(){ 
       CheckValue($(this).val()); 
      }); 

      $("#swapCard_2").click(function(){ 
       CheckValue($(this).val()); 
      }); 

      $("#swapCard_3").click(function(){ 
       CheckValue($(this).val()); 
      }); 

      function CheckValue(value) 
      { 
       if(selectedImageValue != '') 
       { 
        selectedImageValue = value;  
       } 
       else 
       { 
        if(selectedImageValue === value) 
        { 
         //Your logic when image contains the same value 
        } 
       } 
      } 
      }); 
0

Что я буду делать, если я был вам следующий: Pass класс для всех изображений, так что вы можете справиться с ними одним щелчком мыши слушателя. например класс: .image

var phpval; 

$('.image').on('click', function() { 
    if (phpval && phpval === this.value) { 
    //play sound here 
    } else { 
    phpval = this.value; //set php to this value 
    } 
}); 
0

Я бы ввел несколько изменений. Во-первых, я бы разместил класс на всех ваших карточках, чтобы вы могли нацелить их на один селектор. Тогда я буду использовать следующий код:

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 
<script> 
var prev_click; 

$(function(){ 
    $('.swapCard').click(function(){ 
     var this_click = this.value; 

     if(prev_click === this_click){ 
      playSound(); 
     } 
     else{ 
      prev_click = this_click; 
     } 
    }); 
}); 
</script> 
</head> 
<body> 
    <input type="image" id="swapCard_0" class="swapCard" src="image/image0.jpg" value="0"> 
    <input type="image" id="swapCard_1" class="swapCard" src="image/image1.jpg" value="1"> 
    <input type="image" id="swapCard_2" class="swapCard" src="image/image2.jpg" value="0"> 
    <input type="image" id="swapCard_3" class="swapCard" src="image/image3.jpg" value="1"> 
</body> 
</html> 

Этот код прослушивает один клик. Затем он сравнивает предыдущее значение клика с текущим значением клика. Если они совпадают, он воспроизводит звук. Если они этого не делают, он сохраняет текущее значение клика для следующего сравнения. Я думаю, что это делает то, что вы пытаетесь сделать.

+0

Мне интересно играть в звук, который я пытался воспроизвести только в playSound ('sounds/beep.mp3'). Или мне нужно сделать еще одну функцию, которая заставляет звук работать? – james