2

我有两个“页面”(基本上是两个 div 标签;一次只显示一个)。根据用户所在的“页面”,选择框将出现在第 1 页的 jQuery UI 对话框中(作为滑块),或者作为普通选择框出现在第 2 页上。我的问题是,我可以使用 insertAfter() 将选择框从一个页面/div 移动到另一个页面/div 吗?或者,更具体地说,有什么理由我不应该这样做?我避开了 clone() 函数,因为它会创建重复的 ID,并且基本上复制每个选择框并尝试同步它们的值似乎有点过头了,除非有充分的理由不使用 insertAfter()。

这是代码的模型,以防我的解释不够清晰:

HTML:

    <div id="page1">
         <select id="tango">
            <option>Jester</option>
         </select>
    </div>

<div id="page2">
   <div id="dialog">
       <!-- Select Menu would be inserted/moved here -->
   </div>
</div>

JavaScript:

$('select#tango').insertAfter('#dialog');
4

3 回答 3

2

使用$('select#tango').insertAfter('#dialog');脚本实际上会导致:

<div id="page2">
   <div id="dialog">

   </div>
   <!-- Select Menu would be inserted/moved here -->
</div>

我认为您真正希望将其放置在您希望的位置:

$('select#tango').appendTo('#dialog');
于 2012-04-23T21:30:42.427 回答
1

我的问题是,我可以使用 insertAfter() 将选择框从一个页面/div 移动到另一个页面/div 吗?或者,更具体地说,有什么理由我不应该这样做?

不,你没有理由不能或不应该这样做。

于 2012-04-23T21:27:35.640 回答
1

它没有任何问题。这是一个工作演示http://jsfiddle.net/pomeh/FA23E/

HTML 代码

<div id="page1">
     <select>
        <option>A</option>
        <option>B</option>
        <option>C</option>
     </select>
</div>

<div id="page2">
   <div id="dialog">
       <!-- Select Menu would be inserted/moved here -->
   </div>
</div>

<input type="button" value="Dance for me !" />

Javascript代码

var clicks = 0,
    $select = $("select"),
    $targets = [ $("#dialog"), $("#page1") ];

$("input").on("click", function() {
    var $target = $targets[ clicks++ % 2 ];

    $select.appendTo( $target  );
});
于 2012-04-23T21:39:14.397 回答