提交表单在Mobile中不起作用

Submit form not works in Mobile

本文关键字：不起作用 Mobile 表单 提交      更新时间：2023-09-26

我在移动设备中提交表单时遇到问题。使用了一个表单并设置了method="post"，并在提交时调用了一个函数onsubmit="return OnSubmitForm();。我没有使用Jquery或Jquery Mobile，是否可以在Mobile中使用javascript设置表单操作？当我在桌面上收到所有警报时，即使我也无法在移动设备中提醒值。

目的：

提交表单时，它将重定向到另一个页面并在那里显示搜索结果。

结果：

它在桌面浏览器上运行良好，但当我尝试使用移动浏览器浏览时，它不起作用。

Javascript：

<script type="text/javascript">
    function OnSubmitForm() {
        alert('Searching');
        //document.search_form.action = "/SearchConvention.aspx?SearchString=" + document.getElementById("search_term").value;
        document.search_form.action = "/SearchResults.aspx?terms=" + document.getElementById("search_term").value;
var staticStr = "/SearchResults.aspx?terms=";
    alert(staticStr);
    var searcTxt = $('#search_term').val();
    alert(searcTxt);
    var urlSet = staticStr + searcTxt;
    alert(urlSet);
        return true;
    }
  </script>

HTML:

<div class="form" >
    <div class="input-group">
        <form id="search_form" name="search_form" method="post" class="searchform" onsubmit="return OnSubmitForm();">
            <input id="search_term" name="search_term" type="text" value="" type="text" class="form-control" />
            <button type="submit" value="go"><span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span></button>
        </form>
    </div>
</div>

<script>
function formSubmit() {
var searchCriteria = document.getElementById("search_term").value;
if ( searchCriteria.length == 0 )
{
    if (event.preventDefault) {
        event.preventDefault();
    } else {
        event.returnValue = false; // for IE as dont support preventDefault;
     }
     return;
} 
    document.search_form.action = "/SearchResults.aspx?terms=" + searchCriteria;
    document.search_form.submit();
}
    </script>
    <div class="form">
    <div class="input-group">
        <form id="search_form" name="search_form" method="post" class="searchform"  >
            <input id="search_term" name="search_term" type="text" value="" type="text" class="form-control" />
            <button type="button" value="go" id="SearchSubmit" onclick="formSubmit()">Go!</button>
        </form>
    </div>
</div>

您应该将jQuery或更改urlSet变量的定义添加到document.getElementById（'search_term'）.value；

如果您正在使用一些响应灵敏的API，例如Bootstrap，请确保您设置了正确的col-md-col-xs-width值同样的情况也发生在我身上，我在浏览器开发人员模式的"元素"选项卡中注意到表单组div只覆盖了提交按钮的区域浏览器的宽度或在手机上查看页面。

相关文章：