【问题标题】:Make a html attributie with button role submit a form使用按钮角色制作 html 属性提交表单
【发布时间】:2016-10-20 20:50:00
【问题描述】:

我需要让我的 html 属性提交表单。我的问题是普通按钮属性能够使用 type="submit" 而其他使用 role="button" 的属性对类型没有任何作用。

那么如何让它提交表单呢?如果你能给我一个脚本来做,那也很好。

(我自己不懂javascript)

我当前的代码:

<form action="myloc" method="post">
   <div class="input-group col-lg-6">
      <a type="submit" class="btn btn-default input-group-addon" role="button">
        Search<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
      </a>
      <input type="search" class="form-control" name="search" id="search" placeholder="Search">
   </div>
</form>

【问题讨论】:

  • 抱歉代码块没有显示

标签: javascript html forms button submit


【解决方案1】:

如果我理解正确,您想在使用 javascript 按下按钮时提交表单吗?

<form id="test" action="myloc" method="post">
  <div class="input-group col-lg-6">
    <a type="submit" class="btn btn-default input-group-addon" role="button" onclick="document.getElementById('test').submit();">
      Search<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
    </a>
    <input type="search" class="form-control" name="search" id="search" placeholder="Search">
  </div>
</form>

请注意,我所做的是在表单上设置一个 id(“test”),然后将 onclick 事件添加到锚元素。

【讨论】:

    【解决方案2】:

    这是您的解决方案,

    <form action="myloc" method="post" id="myForm">
      <div class="input-group col-lg-6">
        <a type="submit" class="btn btn-default input-group-addon" role="button" id="sub">
        Search<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
        </a>
        <input type="search" class="form-control" name="search" id="search" placeholder="Search">
      </div>
    </form>
    

    Javascript 代码

    var button=document.getElementById('sub');
    button.onclick=function(){
         document.getElementById("myForm").submit();
    }
    

    【讨论】:

    【解决方案3】:

    给你的&lt;a&gt;元素一个id,然后用那个id设置一个jquery onclick函数来运行你想要的任何查询。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-04-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-06-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多