Question

大家好我有这个脚本

<a class="clickMe" toggle="first">Text 1</a>
</br>
<div id="first" class="text"> - This text will be toggled</div>

<a class="clickMe" toggle="second">Text 2</a>
</br>
<div id="second" class="text"> - This text will be toggled 2</div>

和jquery

 $('a.clickMe').click(function () {
   id = $(this).attr('toggle');
   $('.text').not('#' + id).hide();
   $('#' + id).show();
 });

当我们点击This text will be toggled或点击This text will be toggled 2时，通过切换Text 1或Text 2，

上述代码可以正常工作，请查看demo

但是现在我要做的是为切换文本设置固定位置/对齐，现在它在文本1或文本2下面切换，但是我需要将它放在正确的手边，这样任何人都可以TEXT1或TEXT2被点击的TOGGLED声明应该在同一个地方出现（右下方）...请帮助我修复它....

Answer 1

您可以使用span和toggle方法等非块元素。

<a class="clickMe">Text 1</a>
<span class="text"> - This text will be toggled</span>
<br/>
<a class="clickMe">Text 2</a>
<span class="text"> - This text will be toggled 2</span>

$('a.clickMe').click(function () {
   $(this).next().toggle()
});

http://jsfiddle.net/LTYa2/66/

Answer 2

你可以试试这个：

div {
    display: inline-block;
}

Here 是经过纠正的现场演示。

Answer 3

为什么不尝试使用jQuery的.text()功能：

http://jsfiddle.net/FlameTrap/pe8xV/2/

Jquery切换..固定对齐

3 个答案: