Question

我的用户界面遇到了一些问题，这是我的代码：

我在

里面有一个按钮

<button class="btn btn-info" type="button" id="btnSubmit" data-btn="{{ row[1] }}" data-id="{{ row[2] }}" data-toggle="modal" data-target="#myModal" contenteditable="false" disabled='disabled'> Pay</button>

我一直在使用其他函数的row[2]并且它有效，所以这次我使用row[1]来评估数据。条件是当该行的row[1]为空时，该按钮将被禁用，并且将被着色为btn btn-danger，文本将是制作＆＃34;付费＆＃34;但是，经过我的尝试，我只是禁用了所有东西，或者最后一个条目只是禁用了。这是我最近的尝试：

<script type="text/javascript">


$(document).ready(function() {

  var button = document.getElementById('btnSubmit');
  var id = button.dataset.id;

  $('#btnSubmit').attr('data-btn').onkeyup(function() {
    if($(this).val() != '') {
       $('#btnSubmit').prop('disabled', true);
    }
    else{
      $('#btnSubmit').prop('disabled', false);
    }

  });
});
</script>

它禁用所有按钮。我只是希望bytton在它为空时启用，如果它是空的则禁用，并且再次如我所说的那样将被着色为btn btn-danger并且文本将被发送到＆＃34;付费＆＃34;在这种情况下我该怎么做？

我已经阅读了文档和所有内容，但由于某些原因它没有工作。我也尝试过一个看不见的输入并获得它的身份但没有运气。请帮忙

Answer 1

好的......假设data-bnt是要检查keyup的目标元素。

（我不知道data-id的用途是什么......）

目标必须不为空才能启用提交按钮。

然后试试这个：

$(document).ready(function() {
      
      var button = $('#btnSubmit');
      var target = $('#'+button.data('btn'));
      
      target.on("keyup",function(){
        button.prop('disabled', ($(this).val() == '') ? true : false );
      });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" id="targetID">
<button
  class="btn btn-info"
  type="button"
  id="btnSubmit"
  data-btn="targetID"
  data-toggle="modal"
  data-target="#myModal"
  contenteditable="false"
  disabled='disabled'> Pay</button>

如何从属性获取数据然后相应地禁用按钮

1 个答案: