jQuery Mobile表单验证和HTML 5

Question

我是整个jQuery Mobile和HTML5空间的新手（所以请耐心等待），我第一次验证表单。现在我真的想使用html 5验证表单，其中弹出以下内容：

现在我决定给它一个bash，并有以下代码：

<form>
     <input required type="text" name="searchtitle" id="searchtitle" placeholder="Enter the textbook's title">
     <input type="submit" id ="searchsubmit" name="searchsubmit" value="Search">
 </form>

现在，当点击上面的“搜索”按钮时，我有以下代码：

$(document).on('pageinit',"#searchpage",
function()
{
   $("#searchsubmit").click(
   function(e)
   {
   //Do a lot of processing here
   window.location.href ="#results";
   }  
 }); 

现在我要注意为什么当我单击“搜索”按钮时，由于表单验证而运行并且没有停止点击事件，如果我完全错误，有人会指出我正确的方向，这将教我如何做使用HTML5进行表单验证

Answer 1

您提到的那些HTML5“弹出窗口”是由浏览器本身实现的。

我认为他们没有很大的支持。特别是在移动浏览器上，通常运行jQuery Mobile应用程序。

如果我是你，我会使用像jQuery Validate这样的东西来处理表单验证。

http://jqueryvalidation.org

Answer 2

它没有停止的原因是因为input type="submit"默认会提交，所以它正在重新加载页面。您需要在代码中添加以下行：

$(document).on('pageinit',"#searchpage",
function()
{
   $("#searchsubmit").click(
   function(e)
   {
   e.preventDefault(); // add this line to prevent the form from submitting regardless.
   //Do a lot of processing here
   window.location.href ="#results";
   }  
 });