发表新帖
发表新帖

html button v.s. html submit?

后端 未结
关注
6 1353
南旧
南旧 2020-12-09 19:14

I have an input text box and a search submit button, and when user clicks the Search submit button, I want to redirect user to url http://testsearch/results.aspx?k=<

相关标签:
6条回答
  • 旧巷少年郎
    2020-12-09 19:28

    You can even use the submit button this way:

     <input type="submit" id="Go" value="Search" onclick="document.location='http://testsearch/results.aspx?k=StackOverflow'; return false;" />

    Semantically submit button is used to submit forms not redirect pages. You should use normal button type for this. However as i showed you can use the submit button too but that is not semantic i think.

    The below line prevents the form from being submitted.

    return false;

    That is what you are missing in your code :)

    Thanks

    0 讨论(0)
  • 粉色の甜心
    2020-12-09 19:29

    make sure you got the input's in a form tag with a GET method:

    <form action='http://testsearch/results.aspx' method='GET'>
  ... inputs
</form>
    0 讨论(0)
  • 遥遥无期
    2020-12-09 19:33

    <button>-elements and <input type="button"/> don't do anything by default, unless you tell them to do something with Javascript.

    <input type="submit"/> will submit the form it is in.

    So, if <input type="submit"/> won't work, you got it probably not in the <form/>-element itself.

    0 讨论(0)
  • 醉话见心
    2020-12-09 19:39

    If I'm understanding correctly, it is not working because it is not in a form tag. If you put it in a form tag with method="get" it should work. The button works because it does not have to be in a form.

    0 讨论(0)
  • -上瘾入骨i
    2020-12-09 19:43

    If that's the only field in your form, simply set the form's method to "get" and it'll work.

    <html>
<body>
    <form action="http://localhost/mytest" method="get" >
        <input type="text" id="k" name="k" />
        <input type="submit" id="Go" value="Search" />
    </form>
</body>
</html>
    0 讨论(0)
  • 没有蜡笔的小新
    2020-12-09 19:51

    <button> means "put a button in the page and do whatever the onclick event says". So if you don't write an onclick handler the page doesn't do nothing.

    If you use submit is ok, because you want to redirect to another page.

    If you want to use button anyway you can do this way:

    <script>
function doTheSearch() {
  // do the submit mannually
  document.getElementById('myForm').submit();
}
</script>
<form id="myForm" action="results.aspx">
 <input type="text" id="k" name="k" />
  <input type="button" id="Go" value="Search" onclick="doTheSearch();" />
</form>

    Warning: submit button with onclick

    If you have a submit button (inside a form, it is, a working submit button) with an onclick event, some browsers will:

    1) execute onclick

    2) execute submit

    your onclick tries to redirect but the submit button wins.

    If you want to avoid it you have some options:

    a) change submit button to normal button

    b) avoid the submit thing (add onsubmit="return false;" to form element)

    c) use the submit procedure (form action="..." method="get", no onclick event), the browser will be happy and you can control the submit in the onsubmit event (you can cancel it or not).

    0 讨论(0)
 看不清?
提交回复
热议问题