Question

如何使用jquery选择器排除特定元素？通过这个例子，我可以按任意顺序添加尽可能多的水和种子，但是当我点击太阳按钮时，所有的水都应该消失，但种子应该保留。当我点击月亮按钮时，水会在种子未触及时再次出现。我尝试使用＆span;＆＃39; span＆＃39;过滤掉任何元素。标签。我试过.not（＆＃39; span＆＃39;）功能，但没有成功。如何排除包含＆span;＆＃39; span＆＃39;用jquery选择器标记？ TIA

＆＃13;

$("#water").click(function(){$("#garden").append('<div>water</div>');});
$("#seed").click(function(){$("#garden").append('<span><div>seed</div></span>');});
$("#sun").click(function(){$("#garden div").not('span').addClass('vapor');});
$("#moon").click(function(){$("#garden div").not('span').removeClass('vapor');});

＆＃13;

div.vapor{display:none;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id='water'>water</button>
<button id='seed'>seed</button>
<button id='sun'>sun</button>
<button id='moon'>moon</button>
<div id='garden'></div>

＆＃13;

以下是第二个示例，说明为什么必须使用标记而不是使用类。请注意我使用过＆＃39; select＆＃39;和＆＃39;选项＆＃39;在这个例子中，浏览器并不完全支持使用CSS隐藏选项。这个例子我的问题是，如果我点击“太阳＆＃39;按钮10次，我要点击“月亮”。按钮10次为水显示。我需要在＆＃39; sun＆＃39;上使用标签排除功能。按钮，以便它不会包裹＆＃39; span＆＃39;在＆＃39; water＆＃39;选项不止一次。我想要实现的是无论我点击了多少次＆＃39; sun＆＃39;按钮，我只需要点击一次月亮按钮，水就会再次出现。谢谢

＆＃13;

$("#water").click(function(){$("#garden").append('<option class="water">water</option>');});
$("#seed").click(function(){$("#garden").append('<option>seed</option>');});
$("#sun").click(function(){$("#garden option.water").wrap('<span>');});
$("#moon").click(function(){$("#garden span option.water").unwrap();});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id='water'>water</button>
<button id='seed'>seed</button>
<button id='sun'>sun</button>
<button id='moon'>moon</button>
<select id='garden'><option></option></select>

＆＃13;

Answer 1

在 CSS 中，您可以添加以下内容：

.water {display: block}
.seed {display: block}

然后，您可以继续为跨度添加类，水和种子按钮：

$("#water").click(function(){$("#garden").append('<span class="water">water</span>');});
$("#seed").click(function(){$("#garden").append('<span class="seed">seed</span>');});

对于 Sun 和 Moon 按钮，您可以使用jQuery在CSS中操作它们的显示：

$("#sun").click(function(){$(".water").css("display", "none");});
$("#moon").click(function(){$(".water").css("display", "block");});

希望它有所帮助！

Answer 2

似乎没有人有解决方案，经过几天的努力，我找到了自己的解决方案。关键是使用＆＃39;＆gt;＆＃39;在选择器中。我申请了＆＃39;＆gt;＆＃39;我的两个例子和两个工作。再一次，即使它有效，我也不会投票支持我自己的答案，以促进其他优雅的解决方案。不管怎么说，还是要谢谢你。

＆＃13;

div.vapor{display:none;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h4>example 1</h4>
<button id='water1'>water</button>
<button id='seed1'>seed</button>
<button id='sun1'>sun</button>
<button id='moon1'>moon</button>
<div id='garden1'></div>

<h4>example 2</h4>
<button id='water2'>water</button>
<button id='seed2'>seed</button>
<button id='sun2'>sun</button>
<button id='moon2'>moon</button>
<select id='garden2'><option></option></select>

＆＃13;

public class Program
{

    public class Product
    {
        public string Name {get; set;}
        public DateTime Expiry {get; set;}
        public string[] Sizes {get; set;}
    }

    public void Main()
    {
        Product product = new Product();
        product.Name = "Apple";
        product.Expiry = new DateTime(2008, 12, 28);
        product.Sizes = new string[] { "Small" };

        string json = JsonConvert.SerializeObject(product);
        Console.WriteLine(json);

        object str = "test";


        json = JsonConvert.SerializeObject(str);
        Console.WriteLine(json);
    }
}

＆＃13;

使用jquery选择器按标记排除元素

2 个答案: