Unable to get the button value in jquery.
<head>
<script
src=".1.0/jquery.min.js">
</script>
</head>
<body>
<p> This is para </p>
<button> Hide </button>
<script>
function handle(){
value = $("button").attr("value");
alert(value);
}
$(function(){
$("button").click(handle);
});
</script>
What is the error on the above code. I need to handle the event triggered by the button, instead of "this". I already saw how to solve it using "this". So without "this", how to handle event
Unable to get the button value in jquery.
<head>
<script
src="https://ajax.googleapis./ajax/libs/jquery/3.1.0/jquery.min.js">
</script>
</head>
<body>
<p> This is para </p>
<button> Hide </button>
<script>
function handle(){
value = $("button").attr("value");
alert(value);
}
$(function(){
$("button").click(handle);
});
</script>
What is the error on the above code. I need to handle the event triggered by the button, instead of "this". I already saw how to solve it using "this". So without "this", how to handle event
Share Improve this question asked Sep 27, 2016 at 19:48 mohangrajmohangraj 11.2k19 gold badges64 silver badges98 bronze badges 1-
2
The
buttonhas novalueattribute... – J. Titus Commented Sep 27, 2016 at 19:49
3 Answers
Reset to default 2If you want to get the Text inside your button just use:
value = $("button").text() instead of value = $("button").attr("value")
Your button does not have the value attribute from which you can get the data.
So you should use .text() method instead of .attr()
<body>
<p> This is para </p>
<button> Hide </button>
<script src="https://code.jquery./jquery-3.1.0.js"></script>
<script>
function handle(){
value = $("button").text();
alert(value);
}
$(function(){
$("button").click(handle);
});
</script>
</body>
Working example in JSBin
Use the jQuery .text() method with the button element to grab the text value contained within. (e.g. The text between the open <button> and close </button> tags.)
What you're attempting is not working because the button element has no value attribute to retrieve.
Get Text Example:
<script src="https://ajax.googleapis./ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<p> This is para </p>
<button> Hide </button>
<script>
function handle() {
var buttonText = $("button").text();
// Whatever you need to do with the text.
alert(buttonText);
}
$(function(){
$("button").click(handle);
});
</script>
Working code pen
Conversely, you can also set the button's text value using the same method by passing the desired value to it.
Set Text Example:
...
$("button").text("My New Text");
...
Documentation: jQuery .text() Method
button element has no value attribute associated so you must try grabbing the text within the tag <button></button>
you can use jquery's text() method to grab the text as
<html>
<head><title>demo</title>
<script src="https://code.jquery./jquery-3.1.0.js"></script>
<script type='text/javascript'>
$(document).ready(function(){
var x= $('#btn').text();
console.log(x);
});
</script>
</head>
<body>
<button id='btn'>Click Me</button>
</body>
</html>