ボタンから値を取得するときにJavascriptコードが機能しない

Question

ボタンを押すと、最初のボタンの値が表示されます。押されたボタンの値が必要です。

はJavaScript

function GetHadess() { 
     var title = $(".myButtonn").val(); 
     alert(title);  
} 

が押されたボタンの値は、アラートに示すべきであるが、ここでは第一ボタンの値が示されています。このような

HTMLコード

<tbody id="tbl"> 
<tr><td><input class="myButtonn" type="submit" name="title1" value=" bbb " onclick="GetHadess()"></td></tr> 
<tr><td><input class="myButtonn" type="submit" name="title1" value=" bb " onclick="GetHadess()"></td></tr> 
</tbody> 

Answer 1

変更してコード：

<tbody id="tbl"> 
<tr><td><input class="myButtonn" type="submit" name="title1" value=" bbb " onclick="GetHadess(this)"></td></tr> 
<tr><td><input class="myButtonn" type="submit" name="title1" value=" bb " onclick="GetHadess(this)"></td></tr> 
</tbody> 


function GetHadess(this) { 
     var title = this.val(); 
     alert(title);  
} 

Answer 2

あなたは合格する必要がありthis関数にコンテキストを、それは、クリックされた以下のようなどのボタン知っているように： -

function GetHadess(element) { 
 
    var title = $(element).val(); 
 
    alert(title);  
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<tbody id="tbl"> 
 
    <tr> 
 
    <td><input class="myButtonn" type="submit" name="title1" value=" bbb " onclick="GetHadess(this)"> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td><input class="myButtonn" type="submit" name="title1" value=" bb " onclick="GetHadess(this)"> 
 
    </td> 
 
    </tr> 
 
</tbody>

Answer 3

1. 使用このコンテキストをクリックボタンevent.targetを使用して

$('.myButtonn').click(function() { 
 

 
    alert($(this).val()) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tbody id="tbl"> 
 
    <tr> 
 
     <td><input class="myButtonn" type="submit" name="title1" value=" bbb " onclick="GetHadess()"></td> 
 
    </tr> 
 
    <tr> 
 
     <td><input class="myButtonn" type="submit" name="title1" value=" bb " onclick="GetHadess()"></td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 4

代わりにクラスを使用して値を取得する、機能とアクセス値を渡すイベントである伝えるために。値。

function GetHadess(e) { 
 
     console.log(e.target.value); 
 
     alert(e.target.value);  
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<tbody id="tbl"> 
 
<tr><td><input class="myButtonn" type="submit" name="title1" value=" bbb " onclick="GetHadess(event)"></td></tr> 
 
<tr><td><input class="myButtonn" type="submit" name="title1" value=" bb " onclick="GetHadess(event)"></td></tr> 
 
</tbody>