警报消息如果搜索查询不超过x字符

Question

首先，感谢您抽出宝贵的时间来查看我的问题。真的。这是我的问题。我正在为我正在创建的网站制作一个幻想盒搜索页面。在花式盒中获取搜索结果都可以正常工作。

但是，如果访问者只需单击search，它将返回网站上的每个项目。我想要的是制作表单，以使访问者has至少在搜索进行搜索之前输入3个字符。如果访问者未输入3个或更多字符，则会给出警报，说please enter at least 3 or more characters。

我已经环顾了stackoverflow并找到了此代码：

$( document ).ready(function() {
        input_value = $.trim($('#searchkey').val());
        if(input_value == ''){
           alert('Enter some value');
           return false;  //Does not submit the form 
        }else{
          //perform your code if it should not be empty. 
       }
    });

所以我将代码放在正确的位置，就像：

$( document ).ready(function() {
input_value = $.trim($('#str').val());
    if(input_value == ''){
       alert('Enter some value');
       return false;  //Does not submit the form 
    } else {
    $(function() {
      $('#search').on('submit', function(e) {
        e.preventDefault();
        jQuery.fancybox({
          width: 600,
          height: 600,
          openEffect: 'fade',
          closeEffect: 'fade',       
            href: 'search-post-results.php',
            type: "ajax",
              ajax: {
                type: "POST",
                data: {
                  value: $('#str').val()
                }
              }
            });
          });
        });
    }
});

我没有得到任何语法错误，但是如果我重新加载页面，它会给我正确的警报。但是，如果输入了no字符。所以我更改了这一行：

if(input_value == ''){

to：

if(input_value == '2'){

确定我应该设置一个值。但这无济于事。有人有类似的脚本/片段吗？还是知道为什么这不起作用？

这是HTML(那里没什么特别的(：

<form id="search">
  <table>
    <tr>
      <td>
        <input type="text" name="s" id="str" placeholder="Search...">
      </td>
      <td>
        <button class="btn form-button btn-default">
          <i class="fa fa-search"></i>
        </button>
      </td>
    </tr>
  </table>
</form>

thans又有时间。

Answer 1

使用 length属性。

if( input_value.length < 3 ){
   // error message if characters are less than 3
} else {
   // continue the search
}

Answer 2

尝试这个，另外，请更改验证位置，因为如果您重新加载，则始终警报将显示。因此，您可以在提交行动后进行验证。

 $(function() {
      $('#search').on('submit', function(e) {
        e.preventDefault();
        if(input_value.length < 3 ){
          // Show your alert message.
        }else{
         // Here you start Ajax Request.
        }
    });
    });