admin管理员组

文章数量:1023213

There is a checkbox and a button. When you click the button, display the message "Thank you" if the checkbox is clicked. If the checkbox is not active, the message "Goodbye"

<input  type="checkbox" id="checkBox">
<input type="button" id='button'>

There is a checkbox and a button. When you click the button, display the message "Thank you" if the checkbox is clicked. If the checkbox is not active, the message "Goodbye"

<input  type="checkbox" id="checkBox">
<input type="button" id='button'>
  • javascript
  • jquery
Share Improve this question edited Nov 24, 2017 at 20:22 Rory McCrossan 338k41 gold badges320 silver badges351 bronze badges asked Nov 24, 2017 at 20:00 olyashaolyasha 151 gold badge1 silver badge3 bronze badges 8
  • 1 Hmmmm and what do you want? What's you trouble? – Mario Junior Torres Perez Commented Nov 24, 2017 at 20:02
  • a simple if else statement with condition $('#' + id).is(":checked") and an alert should do it ... try doing it yourself ... – Ani Commented Nov 24, 2017 at 20:03
  • Did you at least try to do yourself? – leo.fcx Commented Nov 24, 2017 at 20:03
  • Where would you like to display the message? – John Henry Commented Nov 24, 2017 at 20:05
  • 2 Dear Alyasha, you will need to add a script to your html code, inside this script you can access the html ponents via DOM and perform the action messages you need. In order to help you better please build a entire example containing the javascript and html. If you have no idea what I'm talking about you, I would like to remend you a javascript training, there is plenty on internet. – Rafael Gorski Commented Nov 24, 2017 at 20:10
 |  Show 3 more ments

5 Answers 5

Reset to default 0

This should work

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
 <input  type="checkbox" id="checkBox">
<input type="button" id='button' value = "Click me" onclick="FbotonOn()">
<p id="texto"></p>
</body>
</html>

<script type="text/javascript">
function FbotonOn() { 

    if(document.getElementById('checkBox').checked)
        document.getElementById('texto').innerHTML = "Thank you";
    else
        document.getElementById('texto').innerHTML = "Good Bye";
}


document.getElementById("checkBox").addEventListener("click,", function(){ 
console.log("check box click")});


document.getElementById("button").addEventListener("click,", function(){ console.log("button click")});

Jquery version

$('#button').on("click",function(){

    if( $('#checkBox').is(":checked")){
      alert("checked")
    }else{
      alert("un checked")
    }

})


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

 var checkoutHistory = document.getElementById('ChkCheck');
    if (checkoutHistory.checked) {

alert("Ok");
}
else{
alert("Check box not selected");
}
})
<script src="http://ajax.googleapis./ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<html>
<head>
</head>
<body>
<input type="checkbox" id="ChkCheck">
<input type="submit" value="submit" id="btnSubmit">
</body>
</html>

var checkboxTrue = "CheckBox is checked";
var checkboxFalse = "Please click on the checkbox";

function check() { 

    if(document.getElementById('checkBox').checked) {
        alert(checkboxTrue);
}
    else {
        alert(checkboxFalse);
}
}
<!DOCTYPE html>
<html>
<head>
<title> CheckBox </title>
</head>
<body>
<input type="checkbox" id="checkBox">
<input type="button" id='button' value ="Click me" onclick="check()">
</body>
</html>

There is a checkbox and a button. When you click the button, display the message "Thank you" if the checkbox is clicked. If the checkbox is not active, the message "Goodbye"

<input  type="checkbox" id="checkBox">
<input type="button" id='button'>

There is a checkbox and a button. When you click the button, display the message "Thank you" if the checkbox is clicked. If the checkbox is not active, the message "Goodbye"

<input  type="checkbox" id="checkBox">
<input type="button" id='button'>
  • javascript
  • jquery
Share Improve this question edited Nov 24, 2017 at 20:22 Rory McCrossan 338k41 gold badges320 silver badges351 bronze badges asked Nov 24, 2017 at 20:00 olyashaolyasha 151 gold badge1 silver badge3 bronze badges 8
  • 1 Hmmmm and what do you want? What's you trouble? – Mario Junior Torres Perez Commented Nov 24, 2017 at 20:02
  • a simple if else statement with condition $('#' + id).is(":checked") and an alert should do it ... try doing it yourself ... – Ani Commented Nov 24, 2017 at 20:03
  • Did you at least try to do yourself? – leo.fcx Commented Nov 24, 2017 at 20:03
  • Where would you like to display the message? – John Henry Commented Nov 24, 2017 at 20:05
  • 2 Dear Alyasha, you will need to add a script to your html code, inside this script you can access the html ponents via DOM and perform the action messages you need. In order to help you better please build a entire example containing the javascript and html. If you have no idea what I'm talking about you, I would like to remend you a javascript training, there is plenty on internet. – Rafael Gorski Commented Nov 24, 2017 at 20:10
 |  Show 3 more ments

5 Answers 5

Reset to default 0

This should work

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
 <input  type="checkbox" id="checkBox">
<input type="button" id='button' value = "Click me" onclick="FbotonOn()">
<p id="texto"></p>
</body>
</html>

<script type="text/javascript">
function FbotonOn() { 

    if(document.getElementById('checkBox').checked)
        document.getElementById('texto').innerHTML = "Thank you";
    else
        document.getElementById('texto').innerHTML = "Good Bye";
}


document.getElementById("checkBox").addEventListener("click,", function(){ 
console.log("check box click")});


document.getElementById("button").addEventListener("click,", function(){ console.log("button click")});

Jquery version

$('#button').on("click",function(){

    if( $('#checkBox').is(":checked")){
      alert("checked")
    }else{
      alert("un checked")
    }

})


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

 var checkoutHistory = document.getElementById('ChkCheck');
    if (checkoutHistory.checked) {

alert("Ok");
}
else{
alert("Check box not selected");
}
})
<script src="http://ajax.googleapis./ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<html>
<head>
</head>
<body>
<input type="checkbox" id="ChkCheck">
<input type="submit" value="submit" id="btnSubmit">
</body>
</html>

var checkboxTrue = "CheckBox is checked";
var checkboxFalse = "Please click on the checkbox";

function check() { 

    if(document.getElementById('checkBox').checked) {
        alert(checkboxTrue);
}
    else {
        alert(checkboxFalse);
}
}
<!DOCTYPE html>
<html>
<head>
<title> CheckBox </title>
</head>
<body>
<input type="checkbox" id="checkBox">
<input type="button" id='button' value ="Click me" onclick="check()">
</body>
</html>

本文标签： javascriptWhen you click on the buttondisplay a messageStack Overflow

版权声明：本文标题：javascript - When you click on the button, display a message - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745587146a2157666.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。