添加HTML基于Toggle Jquery

我有一个切换，只是为我正在上班的课程。我需要添加隐藏的HTML基于切换状态..基本上它需要提交与按钮状态的形式..这将是最好的方式来抓住它？我也张贴表格。添加HTML基于Toggle Jquery

这里是我..当我按一下按钮，它增加了实例文本，但我需要它去走，当我再次点击..

$(document).ready(function() { 

    $(".visibilitybutton").click(function(){ 
     $(this) 
      .toggleClass("hide") 
      .find("span").toggleClass("icon84 icon85") 
      $('.buttons_secondary').append("<input type='hidden'>"); 
    }); 

});

来源

2012-07-23 greycode

请问你是否更加彻底，关于你正在努力完成什么，还包括你的html？ – 2012-07-23 18:29:04

@JoshMein当我点击按钮....它添加在HTML（无所谓它是什么。）当我再次单击它时，它将其删除，等等。 – greycode 2012-07-23 18:33:43

buttons_secondary从哪里来？我看了你以前的问题，并试图理解你正在尝试做什么的全貌。在我看来，你正在让它变得更加困难。 – 2012-07-23 18:43:09

您可以删除追加HTML通过ID或类，像这样：根据注销以前的问题的

$('.buttons_secondary').append('<input id="hdf_Test" class="hidden" type="hidden" />'); 

// Remove by class 
$('.buttons_secondary').find('.hidden').remove(); 

// OR Remove by id 
$('.buttons_secondary').find('#hdf_Test').remove();

，我想你应该试试这个：

$(document).ready(function() { 
    $('.button').toggle(function() { 
      var $button = $(this); 

      $button.prop("title","Invisible"); 
      $button.find('.icon85').toggleClass('icon85 icon84'); 
      $('.buttons_secondary').append('<input id="hdf_Test" class="hidden" type="hidden" />'); 
    }, function() { 
      var $button = $(this); 

      $button.prop("title","Visible"); 
      $button.find('.icon85').toggleClass('icon84 icon85'); 

      // Remove by class 
      $('.buttons_secondary').find('.hidden').remove(); 

      // OR Remove by id 
      $('.buttons_secondary').find('#hdf_Test').remove(); 
    }); 
});

来源

2012-07-23 18:37:51

哇@JoshMein，这太棒了！只有一个小问题。第三次点击后，它完全删除icon84/85类。一旦我再次点击它，它就会回来。 – greycode 2012-07-23 19:11:08

看起来像增加了两个类，然后关闭一个，然后关闭，然后重复。 – greycode 2012-07-23 19:12:55

toggleClass（）交换类。如果icon84是原始图标，则用icon85交换图标，反之亦然 – 2012-07-23 19:49:07

$(document).ready(function() { 

    $('.visibilitybutton').toggle(function() { 
      var $button = $(this); 

      $button.prop("title","Invisible"); 
      $button.find('span').removeClass('icon84').addClass('icon85'); 
      $('.buttons_secondary').append('<input id="visibility_setting" class="hidden" type="hidden" />'); 
    }, function() { 
      var $button = $(this); 

      $button.prop("title","Visible"); 
      $button.find('span').removeClass('icon85').addClass('icon84'); 

      // OR Remove by id 
      $('.buttons_secondary').find('#visibility_setting').remove(); 
    }); 

});

来源

2012-07-23 19:38:47 greycode

这是行得通的。 – greycode 2012-07-23 19:39:04

为什么不试试toggleClass而不是打两个电话？ – 2012-07-24 12:10:02

添加HTML基于Toggle Jquery

回答

相关问题