Javascript 正在尝试对多个类使用jquery.slideDown（）_Javascript_Jquery_Html_Css

Javascript 正在尝试对多个类使用jquery.slideDown（）

javascript jquery html css

Javascript 正在尝试对多个类使用jquery.slideDown（）,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我正在尝试将.slideDown（）用于多个类，但一次只需要一个类来切换/下拉！因为如果我当前运行我的代码并按下按钮，它将使它们全部显示，而不是只显示我想显示的代码！我该怎么做？我的html： <!doctype HTML> <head> <title>Ricoz.co.uk Rp Directory</title> <script src="https://ajax.googleapis.com/ajax/li

我正在尝试将.slideDown（）用于多个类，但一次只需要一个类来切换/下拉！因为如果我当前运行我的代码并按下按钮，它将使它们全部显示，而不是只显示我想显示的代码！我该怎么做？
我的html：

    <!doctype HTML>
<head>
    <title>Ricoz.co.uk Rp Directory</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
    <script rel="text/javascript" src="js/script.js"></script>
    <link rel="stylesheet" type="text/css" href="css/stylesheet.css">
</head>
<body>
    <div class="navbar"></div>
    <div class="char">
    <div class="picture"></div>
    <div class="text">
    here is some text!</div>
    <button>test</button>
    </div>
    <div class="char">
    <div class="picture"></div>
    <div class="text">
    here is some text!</div>
    <button>test</button>
    </div>


</body>

JavaScript/JQuery：

$(document).ready(function(){
    $('.text').hide();
    $(this).click(function(){
        $('.text').slideToggle();

    });
});

谢谢您抽出时间

修改javascript，如下所示：

$(document).ready(function(){
    $('.text').hide();
    $(this).click(function(event){
        $(event.target).prev().slideToggle();
    });
});

这将选择上一个元素（与clicker->so按钮相关），但只选择一个（单击按钮上方）。以前，您使用class.text引用所有元素，因此它没有按您希望的方式工作

包含目标属性-单击的按钮，您可以使用它来使用方法获取上一个元素。然后可以触发滑动动画

此外，我还将修改您的选择器

$(this).click(...)

到

因为您只希望以按钮为目标。如果您将类添加到这些按钮（如）。单击按钮，然后通过

$('button.click-button').click(...)

如果您想要一些没有这种效果的按钮。

修改javascript如下：

$(document).ready(function(){
    $('.text').hide();
    $(this).click(function(event){
        $(event.target).prev().slideToggle();
    });
});

这将选择上一个元素（与clicker->so按钮相关），但只选择一个（单击按钮上方）。以前，您使用class.text引用所有元素，因此它没有按您希望的方式工作

包含目标属性-单击的按钮，您可以使用它来使用方法获取上一个元素。然后可以触发滑动动画

此外，我还将修改您的选择器

$(this).click(...)

到

因为您只希望以按钮为目标。如果您将类添加到这些按钮（如）。单击按钮，然后通过

$('button.click-button').click(...)

如果您想使用一些没有这种效果的按钮。

最好改为与目标更相关的选择器，而不是使用

这个，这是文档
@charlietfl很有趣，我也这么想，刚才也建议了。谢谢您的回复，但是我已经稍微修改了代码和页面。我希望代码仍然可以帮助其他人。如果改为与目标更相关的选择器，而不是使用this
，这是document
@charlietfl，那可能是明智之举。有趣的是，我也这么想，刚才也提出了建议。谢谢您的回复，但我已经稍微更改了代码和页面。我希望代码还能帮助其他人。里科兹，我的答案解决了你的问题吗？里科兹，我的答案解决了你的问题吗？