Question

我希望做一些事情：

展开<textarea>框时，请关注<div>。
展开新版本时，折叠以前打开的<div>框
点击“修改”链接后，文字会进入要编辑的<textarea>。所以我要么需要一种方法来使用jQuery将字符串放入<textarea>或自动展开<div>以显示<textarea>，其中包含字符串以进行编辑。

由于我之前的一个问题，我已经扩展/崩溃工作：Expanding / Collapsing divs

内容由PHP / MySQL生成。

这是我的小提琴：http://jsfiddle.net/Draven/kUhkP/85/

很抱歉，如果我遗漏了任何重要信息，如果我想到我应该添加的内容，我会编辑这篇文章。

更多关于＃3

单击“编辑”链接时，页面“刷新”（它是相同的页面但URL更改），他们想要编辑的内容现在显示在<textarea>框中。当页面更改时，它会显示折叠了所有<div>个框的页面。

我需要<div>，<textarea>中的可修改内容会自动展开。

有没有办法检查<textarea>是否有内容，然后<div>展开了？

Answer 1

尝试this：

$(document).on('click', '.postreply', function(e) {
    $(this).closest('.blogcontainer').siblings('.blogcontainer').find('.postreplycontainer').slideUp("fast");
    $(this).closest('.blogcontainer').find('.postreplycontainer').slideToggle("fast")
        .find('textarea[name=replycontents]').focus();
});

在这里，我使用$(document).on来delegate一个事件到所有元素，无论是现在还是未来（动态）。请注意，如果您曾经使用过jQuery * pre * 1.7，那么您只需将.on更改为.delegate即可。由于它是委托，.delegate似乎一度适当，但时代已经改变。现在，如果你愿意，你仍然可以使用'.delegat'。 jQuery已经注意到他们没有“弃用”，也不打算删除.delegate。他们只是觉得1.7中.on的实施已被取代.delegate，因此他们建议使用.on进行委派。

除了.on之外，使用委托形式的$(selector)非常简单，正如您所看到的那样。规则很简单。 $(document)应该是“存在onload”的“父”元素，或者您只需使用.on即可。

您的event参数同样简单。第一个参数是您要分配的'change keydown'的字符串名称。请记住，您可以只使用空格分配多个事件; exp 'div'（这是textareas的流行事件分配）。

第二个参数与任何其他jQuery选择器一样。请记住，将分配符合要求的所有元素。所以e之类的东西会为所有div元素分配一个事件。

最后一个是“回调”方法。 event Object当然代表传入的e.target。例如，$(this)在函数中与$('.blogcontainer textarea[name=replycontents]').filter(function(i) { return $.trim($(this).val()) != ""; }).closest('.postreplycontainer').slideDown("fast");

相同

至于＃3

如果您每次都在重新加载页面，那么只需找到包含内容的第一个文本区域并下载其父容器即可。这只是意味着添加一行简单的代码：

$('.blogcontainer textarea[name=replycontents]')

要打破一些：

.filter(function(i) { return $.trim($(this).val()) != ""; })：我认为您现在已经了解了选择器，但只是注意，请记住，您可以使用“任何”CSS选择器作为jQuery选择器。
(i)：这个方便的小jQuery方法允许我们根据给定的回调“过滤”我们的“选择”结果。
- .closest('.postreplycontainer')代表 index ，基于0。
- 我在这里使用的返回方法“修剪”textarea的值，从而删除尾随和前导空格。 - 因此要编辑的textarea除了空格之外什么都不会返回false。 - 您可能需要编辑此回报以满足您的需求。
- 阅读更多：http://api.jquery.com/filter/
.slideDown("fast");：只需抓取与选择器匹配的最近父元素。
- 为什么我们现在想要父母？好吧，我们发现textarea有内容，现在我们需要扩展父级。
- 请记住，虽然多个textareas可能有内容，但只要我们将其添加到链中，我们只会获得第一个带有conent的父级
{{1}}：最后，通过向内滑动内容来关闭链条！

见Fiddle Here！请记住，我不会“重新加载”页面或任何东西。但是通过在那里排队，第一个包含内容的框将始终向下滑动。如果不需要，您可能需要使用jQuery's Ajax来编辑框。

Answer 2

$("a.postreply").click(function () {
    $('.postreplycontainer').hide();
    $(this).closest('.blogcontainer').find('.postreplycontainer').slideToggle("fast");
    //$('.replycontents').blur();
    $(this).closest('.blogcontainer').find('.replycontents').focus();
});

照顾1和2.我不明白第3点。

展开div + focus，折叠前一个div，然后在新页面上自动展开

2 个答案: