在一個功能，如何界定兩個元素

Question

$('#x').click(function() { 
 
    var letter = 'X'; 
 
    alert(letter); 
 
}) 
 
$('#y').click(function() { 
 
    var letter = 'Y'; 
 
    alert(letter); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='div'> 
 
    <div id='x'>X</div> 
 
    <div id='y'>Y</div> 
 
</div>

在這裏我的腳本的一個屬性，如何可以我定義的一個字母時，我對他們的點擊提示中，同時兼具在一個功能？像這樣

$('#x').click(function() { 
 
    var letter = 'X'; 
 
}) 
 
$('#y').click(function() { 
 
    var letter = 'Y'; 
 
}) 
 
alert(letter);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='div'> 
 
    <div id='x'>X</div> 
 
    <div id='y'>Y</div> 
 
</div>

我也知道變量字母不是函數外定義，但我怎麼能一起合併這兩個功能，一旦通知了嗎？

Answer 1

目標與單個處理器的可點擊元素 - 只需用你所擁有的這種情況下，香港專業教育學院 - 這是uaully通過添加共享類都做了。然後使用每個點擊元素的屬性來區分 - 我通常會使用data-letter="X"屬性，但是我只是使用了你的Id。

$('#div div').click(function() { 
 
    var letter = this.id; 
 
    alert(letter); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='div'> 
 
    <div id='x'>X</div> 
 
    <div id='y'>Y</div> 
 
</div>

Answer 2

你可以結合你的選擇與你的$('#x, #y') click事件處理函數，然後您可以通過點擊的元素的HTML與this.innerHTML並提醒它（或this.id，如果你想使用代替）。

$('#x, #y').click(function() { 
 
    var letter = this.innerHTML; 
 
    alert(letter); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='div'> 
 
    <div id='x'>X</div> 
 
    <div id='y'>Y</div> 
 
</div>

Answer 3

在這裏，你去了一個解決方案https://jsfiddle.net/3g6q8h59/

$('div').click(function(e){ 
 
\t e.stopPropagation(); 
 
\t console.log("ID: " + $(this).attr('id')); 
 
    console.log("InnerHTML: " + $(this).html()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='div'> 
 
    <div id='x'>X</div> 
 
    <div id='y'>Y</div> 
 
</div>

我已經使用jQuery的。附加點擊活動div。

停止事件傳播從點擊div。

Answer 4

可以有多種方法可以做到這一點：

獲取ID爲主要DIV中的所有div = DIV

$('#div div').click(function() { 
    var letter = this.innerHTML; 
    alert(letter); 
}) 

通過將requried DIV ID作爲jQuery選擇獲取特定的div

$('#x, #y').click(function() { 
    var letter = this.innerHTML; 
    alert(letter); 
}) 

爲了簡單起見，你可以一個dd定製類（說'needAlter'）爲所有你想要處理相同方式的div，然後使用類名選擇器。

$('.needAlter').click(function() { 
    var letter = this.innerHTML; 
    alert(letter); 
}) 

在這裏也不得不在你的HTML的變化：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div id='div'> 
    <div id='x' class='needAlter'>X</div> 
    <div id='y' class='needAlter'>Y</div> 
</div>