Question

我使用jquery ui进行基本的标签导航。

<ul>
    <li><a href="#tabs-1" class="boldFont">Home</a></li>
    <li><a href="/pages/show/pages_id/2" class="boldFont" >About</a></li>
    <li><a href="/pages/show/pages_id/3" class="boldFont">Services</a></li>
    <li><a href="/media" class="boldFont">Portfolio</a></li>
    <li><a href="pages/show/pages_id/5" class="boldFont">Submissions</a></li>
    <li><a href="/contact" class="boldFont">Contact</a></li>
</ul>

然后在php页面上我使用jqueryui的单选按钮

切换子菜单

    <?php 
switch($page_id):
    case 1:
        ?>
        <div id="radio">
            <input type="radio" id="radio1" name="radio" checked="checked" /><label for="radio1" onclick="loadOverview();" style="width:100px">Overview</label>
            <input type="radio" id="radio2" name="radio"  /><label for="radio2"  onclick="loadProfiles();" style="width:100px">Profiles</label>
            <input type="radio" id="radio3" name="radio" /><label for="radio3" onclick="loadReel();" style="width:100px">Reel</label>
        </div>
        <?php
        break;
    case 2:
        ?>
        <div id="radio">
            <input type="radio" id="radio1" name="radio" checked="checked" /><label for="radio1" onclick="loadOverview();" style="width:100px">Overview</label>
            <input type="radio" id="radio2" name="radio"  /><label for="radio2"  onclick="loadProfiles();" style="width:100px">Profiles</label>
            <input type="radio" id="radio3" name="radio" /><label for="radio3" onclick="loadReel();" style="width:100px">Reel</label>
        </div>
        <?php
        break;         
    case 3:
        ?>
        <div id="radio">
            <input type="radio" id="radio1" name="radio" checked="checked" /><label for="radio1" onclick="openDialog();return false;" style="width:100px">Location</label>
        </div>
      <?php
        break;         
endswitch;
?>

我结合了标签/保存Cookie标签/和单选按钮设置。

如果我单击其中包含子菜单的选项卡，它将在第一次加载时应用单选按钮格式。

但是如果我在没有重新加载的情况下在两个标签之间点击，我将失去在“服务”标签内容中形成的jquery ui按钮。

我之前在使用ajax之前遇到过这个问题，而且在我看来，我正在正确地对回调中的buttonset进行重新绑定，但它只是不起作用。

谁能告诉我我错过了什么？非常感谢你。

  <script>
        function myreadyFunc(){
            $( "#radio" ).buttonset();
        }

        $(document).ready(function(){
            myreadyFunc();
        });


        $(function() {
            $( "#tabs" ).tabs({
               fx: { opacity: 'toggle',duration:'slow'} ,
                cookie: {
                    // store cookie for a day, without, it would be a session cookie
                    expires: 1
                },
                ajaxOptions: {
                    complete: function() {
                    myreadyFunc();                             
                    },
                    error: function( xhr, status, index, anchor ) {
                        $( anchor.hash ).html(
                            "Couldn't load this tab. We'll try to fix this as soon as possible. " +
                            "If this wouldn't be a demo." );
                    }
                  }
                });
            });

    </script>

jquery + ajax +单选按钮

0 个答案: