基于切换jQuery的添加HTML [英] Add HTML based on Toggle Jquery

问题描述

我刚一类，我自己动手做了一个切换。我需要在基于切换状态隐藏的HTML添加..基本上它需要与按钮的状态提交表单..请问这是抓住它的最佳方式？我张贴的形式也。

下面是我..当我按一下按钮，它添加了例如文本，但我需要它走开时，我再次点击..

  $（文件）。就绪（函数（）{    $（。visibilitybutton）。点击（函数（）{
        $（本）
            .toggleClass（隐藏）
            .find（跨度）。toggleClass（icon84 icon85）
            $（'。buttons_secondary'）追加。（＆LT;输入类型=隐藏＆gt;中）;
    }）; }）;
 

解决方案

您可以删除你的HTML被追加id或class，像这样：

  $（'buttons_secondary。'）追加（'＆LT;输入ID =hdf_Test级=隐藏TYPE =隐藏/＆GT;'）。//通过类删除
$（'。buttons_secondary'）找到（'隐藏'）删除（）。//或按ID删除
$（'。buttons_secondary'）找到（'＃hdf_Test'）删除（）。
 

根据关闭previous问题，我认为你应该试试这个：

  $（文件）。就绪（函数（）{
    $（'按钮'）。切换（函数（）{
          变量$按钮= $（本）;          $ button.prop（称号，隐形）;
          $ button.find（'。icon85'）toggleClass（'icon85 icon84'）。
          $（'。buttons_secondary'）追加。（'＆LT;输入ID =hdf_Test级=隐藏TYPE =隐藏/＆GT;'）;
    }，函数（）{
          变量$按钮= $（本）;          $ button.prop（称号，可见）;
          $ button.find（'。icon85'）toggleClass（'icon84 icon85'）。          //通过类删除
          $（'。buttons_secondary'）找到（'隐藏'）删除（）。          //或按ID删除
          $（'。buttons_secondary'）找到（'＃hdf_Test'）删除（）。
    }）;
 }）;
 

I have a toggle that was just made for a class I am getting to work. I need to add in hidden HTML based upon the toggle state.. Basically it needs to submit with the form with the state of the button.. Would this be the best way to grab it? I am posting the form also.

Here is what I have.. When I click the button, it adds the example text, but I need it to go away when I click again..

 $(document).ready(function () { 

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

 });

解决方案

You can remove the html you append by id or class like so:

$('.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();

Based off of your previous question, I think you should try this:

$(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();
    });
 });

这篇关于基于切换jQuery的添加HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！