Question

我们拥有一家商店，用户可以在其中输入产品标题或搜索产品SKU进行搜索。我们想向在搜索框中输入数字的用户显示提示，以向他们提供有关搜索SKU的信息。

示例：搜索Polo，没有任何反应。在搜索GD459时，会出现一个提供信息的框。

我在SO上看到了很多答案，这些答案可以检测整个事物是数字还是文本，但不能同时检测两者。

我知道要检测用户类型，我应该执行以下操作：

$("form input").keyup(function(){
    // presumably an if statement?    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form action="/search" method="get" class="input-group search-bar" role="search" >
  <input type="search" name="q" value="{{ search.terms | escape }}" placeholder="{{ 'general.search.placeholder' | t }}" class="input-group-field" aria-label="{{ 'general.search.placeholder' | t }}">
  <br>
  <span class="input-group-btn">
	<button type="submit" class="btn icon-fallback-text">
	  <span class="icon icon-search" aria-hidden="true"></span>
	  <span class="fallback-text">{{ 'general.search.submit' | t  }}</span>
	</button>
  </span>
</form>

我很欣赏这并不需要花费很多代码，但是朝着正确方向的一般理解确实会有所帮助。

Answer 1

尝试类似的东西：

$("form input").keyup(function(){
    if(this.value.match(/^[a-zA-Z]+$/) && this.value.match(/^[0-9]+$/)) {
        alert('Letters and numbers!');
    } else {
        // Not letters and numbers
    }
}

如果您有特定的SKU格式，则可以进一步优化它，例如2个字母加上4-8个数字：

$("form input").keyup(function(){
    if(this.value.match(/^[a-zA-Z]{2}[0-9]{4,8}$/)) {
        alert('Match');
    } else {
        // No match
    }
}

Answer 2

您需要使用.split()将字符串拆分为组成部分，然后循环遍历这些部分并测试数字；

$("form input").keyup(function(){

    const stringArray = $(this).val().split("");
    let isNumeric = false;

    $(stringArray).each(function(i,v){ //i = index, v = value at that index
        if(!isNaN(v))
        {
            isNumeric = true;
            return false;
        }
    });

    if (isNumeric)
        alert("Yay it's got a number in it");
});

当用户输入数字时，显示一个对话框

2 个答案: