Question

我对切换功能有疑问。我有5个字段，就像一个复选框，类似这样：

<li class="flex-item">
                  <label class="labelFlex" title="ŻYCIE" for="ŻYCIE">
                  <i class="fas fa-heart fa-10x"></i>
                  <input value="" name="ŻYCIE" id="ŻYCIE"type="checkbox">
                    <span>ŻYCIE
                    </span>

                  </label>
                  <button type="button" class="btn btn-mini data-popover" data-trigger="click" data-placement="left" data-content="" data-original-title="" title="">
                    <i class="fa fa-info"></i>
                  </button><i class="fas fa-edit edit" id="ŻYCIE" onclick="edit(1,'obszar')" style="color:#006; font-size:23px;"></i>

当我单击标签时，它正在改变颜色。

$('.labelFlex').toggle(
    function(){
      $(this).find('i').css('color', '#149614');
      $(this).find('span').css('color','#149614');
      $(this).find('input').attr('checked', 'checked');
    }, function(){
      $(this).find('i').css('color', '#006');
      $(this).find('span').css('color','#006');
      $(this).find('input').removeAttr('checked');
    }
  );

告诉我为什么重新加载后它不起作用？我的意思是，我正在做类似的事情：

$('.flex-container').html(' ');
$('.flex-container').load('action.php?action=reloadObszary');

因为我正在用ajax编辑内容，所以我想重新加载它。当我这样做时，切换不起作用，它不会返回任何错误。为什么？

编辑：

$('body').on('click', '.labelFlex', function()
  {
    var state = $(this).data('state');
    switch(state){
      case 1 :
        case undefined :
          $(this).find('i').css('color', '#149614');
          $(this).find('span').css('color','#149614');
          $(this).find('input').attr('checked', 'checked');
          alert(state);
          $(this).data('state', 2);
        break;
        case 2 :
          $(this).find('i').css('color', '#006');
          $(this).find('span').css('color','#006');
          $(this).find('input').removeAttr('checked');
          alert(state);
          $(this).data('state', 1);
        break;
      break;
    }
});

重新加载后可以正常工作，但不能像拨动开关一样工作。当我单击它时，直接转到第2种情况；并将颜色更改为第一种颜色。

重新加载内容时toggle（）不起作用

0 个答案: