从按钮中删除prop属性以验证我的表单

时间:2017-02-03 20:18:02

标签: jquery

我正在尝试创建表单表单验证,如果我的输入为空,则应禁用按钮。我是通过jquery和prop来做到的。但我想我错过了一些东西。我在下面添加了我的代码。

我的ascx页面

<?php

$file = fopen("nums.txt", "r");
$i = 0;
$line = "";
$access_key = '1234567890';
while (!feof($file)) {
     $line .= fgets($file);
}
$numbers = explode("\n", $line);

for ($i=0; $i < count($numbers); $i++) { 
    $ch = curl_init('http://apilayer.net/api/validate?access_key='.$access_key.'&number='.$numbers[$i].'');  

    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

    $json = curl_exec($ch);

    curl_close($ch);

    $validationResult = json_decode($json, true);
    echo $numbers[$i] . '</span>' . $validationResult['valid'] . ' ' . $validationResult['country_code'] . ' ' . $validationResult['carrier'];
}

fclose($file);


?>

我的Jquery

<input id="Name" type="text" class="Name" value="">

<button id="edit" disabled="disabled">Edit</button>

问题: 问题是当我在输入框中添加文本按钮应该启用时才会发生。

3 个答案:

答案 0 :(得分:0)

您的if语句中包含拼写错误,if而非id

  if ($.trim($('#Name').val()) == ''){
    return false;
  }
  else{
    return true;
  }

答案 1 :(得分:0)

您可以使用keyup事件直接测试输入的内容(没有指定的函数)并使用$(this).val().trim()来确定内容 - 然后将禁用状态基于此。

另请注意,您缺少文本输入的名称属性,这意味着它不会通过表单传递,除非您使用ajax调用或其他javascript来获取该输入的值。

    $(document).ready(function(){
      $('#Name').keyup(function(e) {
          if ($(this).val().trim() == ''){
            $('#edit').prop('disabled', true);
          }
          else {
            $('#edit').prop('disabled', false);
          }
      });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="Name" type="text" class="Name" value="">

<button id="edit" disabled="disabled">Edit</button>

答案 2 :(得分:0)

代码中的问题是验证成功后,您将按钮的disabled属性设置为true。你需要在if-else中交换代码块,并且还缺少右括号。

      $(document).ready(function() {
          $('#Name').keyup(function(e) {
              if (ValidationForm() === true) {
                  $('#edit').prop('disabled', false);
              } else {
                  $('#edit').prop('disabled', true);
              }
          }
      });