0

我使用 jQuery，并且我有多个选项卡，它们看起来大多不同。有一个在所有选项卡上共享的选择框，我基本上希望它在所有不同的选项卡上具有相同的值和选定的值，所以如果它在一个选项卡中更改，那么它也会在另一个选项卡中更改。

<div id="tabs">
<ul>
    <li><a href="#tab-1">Tab 1</a></li>
    <li><a href="#tab-2">Tab 2</a></li>
</ul>
<div id="tab-1">
    Content 1
    <select>
        <option>op1</option>
        <option>op2</option>
    </select>
</div>
<div id="tab-2">
    Content 2
    <select>
        <option>op1</option>
        <option>op2</option>
    </select>
</div>
</div>

并且标签被选中

$(document).ready(function(){
    $("#tabs").tabs();
}

我希望将第一个选择框复制到第二个选项卡上，或者始终与另一个选择框相同。有没有一种干净的方法来做到这一点（不复制 tab.change() 或其他东西），或者可能是一种完全不同的方法？

4

2 回答 2

1

我希望这个对你有用。代码写得很匆忙。对造成的不便表示歉意。

<div id="tabs">
<ul>
<li><a href="#tab-1">Tab 1</a></li>
<li><a href="#tab-2">Tab 2</a></li>
</ul>
<div id="tab-1">
Content 1
<span id="fcont"><select><option>op1</option><option>op2</option></select></span>
</div>
<div id="tab-2">
Content 2
<span id="scont"></span>
</div>
</div>

在 jQuery 中

$(function()
{
   var mysel= "";
   $("#tabs").tabs();              
    $('#tab-1').click(function()
   {
     mysel = $("#scont").html();
     if(mysel)
     {
       $("#fcont").html(mysel);
       $("#scont").html("");
     }
   });
   $('#tab-2').click(function()
   {
     mysel = $("#fcont").html();
     $("#scont").html(mysel);
     $("#fcont").html("");
   });
});
于 2013-02-22T11:20:23.220 回答
0

您是否尝试过使用.clonejQuery 函数。

$(SELECT).clone().append(NEWTAB_HTML);

详细地。

$(function()
{
    $("#tabs").tabs();

    $('#tab-2').click(function()
    {
        var newSelect = $('#tab-1 select').clone().attr('id','new_id_value');
        $(this).append(newSelect);
    });

});
于 2013-02-22T09:54:21.630 回答