Question

我正在尝试编写一些验证作为我的页面的一部分，以确保文本框是否有一些必需的文本，如果它不在那里它将禁用该按钮。

我使用以下jQuery代码完美地工作：

 <script>
 $(document).on("ready", function () {
     $('input[type="text"]').on('blur', function () {
        var $required = $(this).next().val();
        var $image = $(this).parent().next().children('img');
        var $errors = $('img:visible').length;
        if (($(this).val().indexOf($required) == -1) && ($(this).val() != '')) {
            $image.show();
            $("#submit").prop("disabled", true);
        } else {
            $image.hide();
            //Manually subtract from error otherwise it doesnt subtract until the next focus change
            $errors--;
            if ($errors == 0)
                $("#submit").prop("disabled", false);
        }
    });
});

</script>

当文本框需要两个值时，会出现问题。它们以逗号分隔的字符串存储在隐藏的输入中。我如何检查两者是否存在？只要它们都存在，它们就可以以任何顺序存在。我知道我可以使用.split（'，'）获取和数组并测试它们，但那就是我坚持使用的部分。

我尝试过同时使用.inArray（）和.each（），但是无法使用它。

我试图设置一个小提琴，但无法让它发挥作用。

以下是HTML的缩减版本，因为它是一个MVC项目，所以大部分都由模型等填充。

HTML

  <table width="100%" border="1px solid">
    <tr>
        <th>Source Text</th>
        <th>Translation</th>
    </tr>

    <tr>
        <td>Some text here</td>
        <td><input type="Text"><input type="hidden" value="Some"></td>
        <td><img id="cross" src="../cross.png" class="jq-cross hid" alt="error" /></td>
    </tr>

    <tr>
        <td>Some text here</td>
        <td><input type="Text"><input type="hidden" value="Some,Here"></td>
        <td><img id="cross" src="" class="jq-cross hid" alt="error" /></td>
    </tr>
<tr><td colspan="3"><button id="submit" type="submit">Update Translations</button>  </td></tr>
 </table>

您可以给予我任何帮助，我将不胜感激。希望我在这里提供了足够的信息。

提前致谢

Answer 1

只需使用For ... In Statement：

for(x in $required)
{
    if($(this).val().indexOf($required[x]) !== -1)
    {
        // Code in case if text don't have required string
    }
}

Answer 2

$(document).on("ready", function () {
     $('input[type="text"]').on('blur', function () {
        var $required = $(this).next().val().split(','); // split values with comma
                                                         // and make array
        var $image = $(this).parent().next().children('img');
        var $errors = $('img:visible').length;
        var value = $.trim( this.value );           // get blur text field value

        // checking value with inArray()

        if ( $.inArray(value, $required) ) {
            $image.show();
            $("#submit").prop("disabled", true);
        } else {
            $image.hide();
            //Manually subtract from error otherwise it doesnt subtract until the next focus change
            $errors--;
            if ($errors == 0)
                $("#submit").prop("disabled", false);
        }
    });
});

Answer 3

您可以编写一个函数来循环逗号分隔的字符串，例如：

function isTextInText(text, searchtext) {
    var arr = text.split(',');

    for(var i=0, len=arr.length; i < len; i++) {
        if (searchtext.indexOf(arr[i]) == -1) return false;
    }
    return true;
}

console.log(isTextInText("hello","hello there")); //true   
console.log(isTextInText("hello,there","hello there")); //true
console.log(isTextInText("hello,bye","hello there")); //false

然后你的if逻辑可以变成：

if (isTextInText($required,$(this).val())

小提琴 - http://jsfiddle.net/e7qkd/

如何使用jQuery检查数组的所有元素是否在Textbox中？

3 个答案: