0

我有一种情况,有很多按钮(基本上与图标跨越,但像按钮一样)。在 css 的帮助下按下时,每个按钮都会被着色。此按钮应链接到 javascript 中的变量或函数。我想要的只是按钮和javascript应该同步,这意味着当按下按钮时,javascript变量应该为真,或者当js变量为真时,按钮应该处于按下或打开状态。我已经完成了这个逻辑,但它看起来并不是最佳实践,因为有时 UI 按钮和 javascript 不同步。有没有最好的方法来做到这一点?还应该有一种方法可以通过一个javascript函数控制按钮组的状态

注意:我不想调用 Ajax 或任何东西来与服务器通信。这纯粹是 UI 要求。

HTML

 <span onclick="applyPropertiesChanges('Text', textButton)"> <span id="switch"
            class="text_btn-background toolboxItem ui-icon btn-icon-enable btn-fontItalicIcon" /></span>

JS

var textButton
function applyPropertiesChanges(type,value)
{
  if(type == 'Text')
 { textButton = !textButton;
  //Check the UI span 
  if(value && this.children.hasClass('btn-icon-enable') &&)
{ 
 //UI span is on
//do nothing
}else{
  if(!value && !this.children.hasClass('btn-icon-diable')
 {// do nothing
 } else 
{
// Toggle the class of the span
}
}

 }
}
4

1 回答 1

0

如果您只是向跨度添加一个属性或类,您可以更轻松地实现这一点。然后您可以检查哪些具有该属性:

 <span class="btn"> <span id="switch"
            class="text_btn-background toolboxItem ui-icon btn-icon-enable btn-fontItalicIcon" /></span>

$('.btn').click(function() {
   $(this).addClass('data-clicked');
   $('.btn').not(this).removeClass('data-clicked');
});

现在,当您单击时,您可以轻松知道哪个被单击:$('.btn.data-clicked')并基于此启用禁用。

于 2013-04-04T18:40:27.703 回答