Question

<form id="search" action="#" method="post" style="float: left">              
    <div id="input" style="float: left; margin-left: 10px;" >
        <input type="text" name="search-terms" id="search-terms" placeholder="Search websites and categories..."  style="width: 300px;">
    </div>
    <div id="label" style="float: left; margin-right: 10px;">
        <button type="submit" onclick="searchbox()" for="search-terms" id="search-label" class="glyphicon glyphicon-search"></button>
    </div> 
</form>

当用户点击div label时，我想切换div input的显示属性。这工作正常。我使用以下代码来实现该功能。

function searchbox(){
    if ($("#input").css('display') == 'none') { 
        $('#input').css('display','block'); 
    } else { 
        $('#input').css('display','none');
    }
}

我想通过POST提交表单数据但该功能无效，无论是按Enter键还是单击提交按钮。

请帮助我。

Answer 1

您必须使用<input type=submit>提交

Answer 2

尝试通过JS提交

HTML

<form id="search" action="#" method="post">              
    <div id="input" style="float: left; margin-left: 10px;" >
        <input type="text" name="search-terms" id="search-terms" placeholder="Search websites and categories..."  style="width: 300px;">
    </div>
    <div id="label" style="float: left; margin-right: 10px;">
        <button type="submit"  for="search-terms" id="search-label" class="glyphicon glyphicon-search">click</button>
    </div> 
</form>

JS

$(".glyphicon").click(function(e){
    e.preventDefault();

         if ($("#input").css('display') == 'none') { 
                $('#input').css('display','block'); 
            } else { 
                $('#input').css('display','none');
            }

            $( "#search" ).submit();

        });

如何通过POST提交表格？

2 个答案: