Question

是否可以禁用子div if $("#parent").hasClass("bar"); 内的按钮，而在实际按钮上放置data-bind...属性？以下是我的代码。我觉得这是可能的，但我不确定我是否接近它：

HTML：

<div id="parent" class="">
  <div class='active'>
    <button>Button 1</button> 
  </div>
<div>

JS

function foo(){
  var self = this;   
  self.parent = ko.pureComputed(function(){
    return $('#parent').hasClass('bar');       
  });
  if(self.parent){
    $('.active button').attr("disabled",true);
  }  
};
ko.applyBindings(foo);

这种方法的原因是会有很多很多子div，但只有一个有活动类，如果我不需要，我担心绑定所有这些div。非常感谢，

Answer 1

如何使用订阅并窃取monkey_dev1300 jquery。

在下面运行代码段。并将类从foo更改为bar。

＆＃13;

function viewModel(){
var self = this;
this.parentCss = ko.observable('foo');

}
var vm = new viewModel()
ko.applyBindings(vm);

vm.parentCss.subscribe(function(newValue) {
    if(newValue === 'bar')
    { $('.active button').attr("disabled",true); }
    else
    {{ $('.active button').attr("disabled",false); }}
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>
change class:  <input data-bind="value: parentCss"/>
</p>


<div id="parent" data-bind="css: parentCss"
  <div class='active'>
    <button >Button 1</button> 
  </div>
    <div class='active'>
    <button >Button 2</button> 
  </div>
   <div class='active'>
    <button >Button 3</button> 
  </div>
<div>

＆＃13;

Answer 2

如果你想“禁用”一个按钮，你可以使用它与JQuery和css：

$('button').css("pointer-events", "none");

这将停止按钮触发点击事件。

同样，您可以使用

“启用”它

$('button').css("pointer-events", "auto");

如果父hasClass，则敲除js禁用按钮

2 个答案: