简体   繁体   中英

make submit button disappear when clicked

I wanted to know if there was a way I could adapt this code so that when the submit button was clicked, it would disappear, but the input box would remain.

<script type="text/javascript">

 var Text = 'hello';

    function setInput(button) {
       var buttonVal = button.name,
       textbox = document.getElementById('input_' + buttonVal);
       textbox.value = Text ;
    }
</script>

<html>
      <input class='input' id="input_a1" name="a1" value="<?php {echo $a1;} ?>"> 
      <input type='submit' name='a1' value='x' onclick='setInput(this); return false;'>
</html>

Simply add :

   button.style.visibility = "hidden";

at the end of your SetInput function.

If you want it to disappear use...

button.style.visibility = "hidden";

However, that will leave the space the button was taking (but it will be blank).

If you want the space to disappear as well, use this instead of the visibility ...

button.style.display = "none";
<script type="text/javascript">

 var Text = 'hello';

    function setInput(button) {
       var buttonVal = button.name;
       button.style.display = 'none'; // insert this line
       textbox = document.getElementById('input_' + buttonVal);
       textbox.value = Text ;
    }
</script>

Write a js function that will hide an element.

function hide() {
    var div = document.getElementyById('whatYouWantToHide');
    div.style.display = 'none';
}

You can of course pass it as an argument, which would be the nice solution.

<button onclick="style.display = 'none'">Click Me</button>

HTML (no button) : input id="myButton" type="hidden" value="Click ME? "

this line will make the button visible: document.getElementById("myButton").type="button";

I found it much simple

<script type="text/javascript">
function submitform()
{
    document.forms["myform"].submit();
}
</script>
<form id="myform" action="submit-form.php">
Search: <input type='text' name='query'>
<a href="javascript: submitform()">Submit</a>
</form>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM