jQuery .click().toggle()-更改显示和交换字符 [英] jQuery .click() .toggle() - change display and swap character

问题描述

这是我的jQuery:

Here is my jQuery:

$('.ask').click(function() {
    $('.addtitle').slideToggle('fast', function() {
    // Animation complete.
    });
});

还有我的HTML:

                            <p class="ask">+</p>
                                <div class="addtitle">
                                    <p>Give your Idea a great title</p>
                                    <form name="input" action="#" method="get">
                                        <input id="title" type="text" name="title" />
                                        <input id="go" type="submit" value="Go" />
                                    </form> 
                                </div>

我在页面上有多个.ask div，我只希望它影响名为.ask的.next()div，而不是所有名为.ask的div.

I have multiple .ask div's on the page and I only want it to effect the .next() div named .ask rather than all div's named .ask.

我还想将'+'字符切换为'-'

I also want to .toggle() the '+' character to '-'

有人可以协助吗?

推荐答案

您可以使用 .next() 和 .toggle() 像这样:

You can do it using .next() and .toggle() like this:

$('.ask').toggle(function() {
  $(this).text('-').next('.addtitle').slideDown('fast');
}, function() {
  $(this).text('+').next('.addtitle').slideUp('fast');
});

.next(selector) 如果与选择器匹配，则获取下一个同级项(如果可能存在某些内容)然后使用 .nextAll('.addtitle:first') ，

.next(selector) get the next sibling if it matches the selector, if there may be something in-between then use .nextAll('.addtitle:first'), .toggle() cycles between the functions you provide on each click event, so it'll swap the text and slide appropriately every click.

这篇关于jQuery .click().toggle()-更改显示和交换字符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！