jQuery在重定向之前检查哪个输入文本框的边框颜色为红色 [英] JQuery check which input textbox's border color is red before redirecting

问题描述

我有一个问题.我设计了一个按钮，当用户单击该按钮时，它会触发一个函数，该函数使用JQuery检查哪个输入文本框为红色.如果找到一个框，请在此页面上停止而不是重定向，并通知用户输入无效.这是一个演示:链接

I have a question. I design a button and when user clicks this button, it triggers a function to check which input textbox is red using JQuery. If one box is found, stop on this page instead of redirecting, and inform user that there is invalid input. Here is a demo: Link

HTML代码:

<input type="text" list="list" autocomplete="on" name="client" id="clientTxt" style="border-color: red; display: inline-block;">
<input type="text" list="list1" autocomplete="on" name="Installation" id="Installation" style="border-color: red; display: inline-block;">
<input type="submit" value="Create" id="create-submit">

jQuery代码:

$('#create-submit').click(function (event) {
    $('input[type = text]').each(function (event) {
        if ($(this).css('border-color') == 'red') {
            alert("Please check red input boxes and click create again.");
            event.preventDefault();
        }
    });
});

但是，在演示中，JQuery函数未按预期运行.请帮我.非常感谢.

However, in demo the JQuery function is not working as expected. Please help me with it. Thanks a lot.

推荐答案

尝试

$("#create-submit").click(function(event) {
  event.preventDefault();
  var res = $("input[type=text]").toArray().some(function(el) {
    return $(el).css("border-color") === "rgb(255, 0, 0)"
  });
  // `border-color` === `rgb(255, 0, 0)` , `border-color`:`"red"`
  if (res) {
    alert("Please check red input boxes and click create again.");
  } else {
    // do other stuff
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<input type="text" list="list" autocomplete="on" name="client" id="clientTxt" style="border-color: red; display: inline-block;">
<input type="text" list="list1" autocomplete="on" name="Installation" id="Installation" style="border-color: red; display: inline-block;">
<input type="submit" value="Create" id="create-submit">

jsfiddle https://jsfiddle.net/fzcvsj1m/2/

jsfiddle https://jsfiddle.net/fzcvsj1m/2/

这篇关于jQuery在重定向之前检查哪个输入文本框的边框颜色为红色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！