Question

如何自定义HTML5验证消息，使其在所有Web浏览器中保持一致？目前，所需的“请填写此字段”的默认错误消息显示在一个矩形框中（在IE中），在Firefox中，相同的消息弹出一个矩形圆角，在Chrome中，消息后缀为橙色图标的 “i”。

我希望在所有浏览器中使此消息弹出一致。

<input id="username" type="text" required ="required">

HTML5中的必需属性将弹出消息“请填写此字段”

修改 “kendo-ui / tooltip”开源免费用于商业目的吗？没有使用kendo-ui还有其他方法可以做同样的事吗？

可以使用jpqery $( document ).tooltip({})或jquery dialog处理并将其绑定到不同的事件吗？例如，当按下enter key时，此事件应运行jquery验证代码并检查文本字段是否已填充。如果未填写，则应弹出消息，说明“请填写字段”。稍后，当输入号码时，消息将消失。

或者，我们是否可以使弹出式气泡看起来与所有浏览器中的chrome中出现的气泡相似？

当用户试图再次输入字段值（重新绑定等）时，我无法确定如何继续使用onfocus。

     <script>
  $( function() {
    $( "#dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "explode",
        duration: 1000
      }
    });
   $(".testing").keydown(function (event) {
        var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
            $( "#dialog" ).dialog( "open" );
        }
    }); 
    $( "#opener" ).on( "click", function() {
      $( "#dialog" ).dialog( "open" );
    });
  } );
  </script>
</head>
<body>
 <input type="text" class="testing" /><br />

<div id="dialog" title="title">
  <p>Please fill this field</p>
</div>

<button id="opener">validate</button>


</body>
</html>

关于这个问题，我最近也找到了Validate.js.

Chrome / Firefox / IE自定义HTML5验证消息：一致的外观和消息

0 个答案: