用於HTML5的JavaScript必填字段設置爲在Safari中工作

Question

我正在使用以下腳本來更改我的input元素的HTML5 required屬性。我想知道是否有辦法修改這個腳本，使它也可以在Safari瀏覽器中工作，因爲Safari不支持這個屬性。

下面是腳本：

$(document).ready(function() { 
    $_POST = array(); 
    var elements = document.getElementsByTagName("INPUT"); 
    for (var i = 0; i < elements.length; i++) { 
     elements[i].oninvalid = function(e) { 
      e.target.setCustomValidity(""); 
      if (!e.target.validity.valid) { 
       e.target.setCustomValidity("This field can't be blank"); 

      } 
     }; 
     elements[i].oninput = function(e) { 
      e.target.setCustomValidity(""); 

     }; 
    } 
}) 

Answer 1

看看這個頁面在這裏。它包含一個哈克的解決方案，應該補充所需的功能

http://www.html5rocks.com/en/tutorials/forms/constraintvalidation/#toc-safari

Answer 2

你將需要使用運行在您的表單提交事件處理程序的檢查自己。在該處理程序中，您自己運行檢查，如果失敗，則顯示任何錯誤消息並使用preventDefault或return false阻止提交。

An example can be found here，雖然它注意到，如果您使用checkValidity作爲檢查表單的手段，您需要小心。

Answer 3

你也可以這樣做：

var valid = true; 
$('input[required]').each(function() { 
    if (this.value == '') { 
     // Alert or message to let them know 
     valid = false; 
     return false; // stop on first error, or remove this and it'll go through all of them. 
    } 
}); 

if (valid === false) { 
    return false; 
}