重新加载页面后,data-toggle =“pill”不起作用

时间:2013-02-11 22:07:43

标签: jquery css html5 twitter-bootstrap tabs

在下面的代码中,当用户点击锚标记转到Java动作类并返回到同一页面时,但之前单击的链接未显示为活动选项卡。我们将活动选项卡的值作为post参数传递给action类。我们如何在返回的页面上捕获它,并使链接在进入操作类之前处于活动状态。

这是示例代码:

<script type="text/javascript">
    function submitTab(type) {
        if(document.myOrderForm.pagetype.value != type) {
            document.myOrderForm.pagetype.value=type;
            // The type is passed from the submitTab method on the anchor onclick event.
            document.myOrderForm.submit();
        }
    }
</script>

表单元素是:

<form name="myOrderForm" method=post action="<c:url value="/LoadMyOrder.go" />" >
    <input type="hidden" name="pagetype" value='${requestScope.pagetype}'>
    // this hidden name pagetype gets set by the value from action class and
    // and is equal to one of the list items in the hyperlinks ('OO','CO' or 'CS')
    // if value of the page type equals to one of those above values i want to mark
    // the respective "LI" to class="active"

    // I think we need to do it on the -- $(document).ready(function() { 
    // but not quite sure. If some one donot understand  let me know.

    <div class="row-fluid">
        <div class="span12">
            <div class="pull-left">
            <ul class="nav nav-pills">
                    <li>
                        <a onclick="javascript:submitTab('OO')"; href="#" data-toggle="pill" >
                &nbsp;<b><fmt:message key="myorder.openorder" /></b>
                        </a>
                    </li>
                    <li>
                        <a onclick="javascript:submitTab('CO')"; href="#" *data-toggle="pill"*>
                &nbsp;<b><fmt:message key="myorder.completedorder" /></b>
                        </a>
                    </li>
                    <li>
                        <a onclick="javascript:submitTab('CS')"; href="#" *data-toggle="pill"*>
                            &nbsp;<b><fmt:message key="myorder.current.service" /></b>
                        </a>
                </li>
            </ul>
            </div>
        </div>
     </div>
</form>

我在想这样的事情。我是bootstrap和jQuery的新手

<script type="text/javascript">
    var pageToGo = "${requestScope.pagetype}";
    alert("pageToGo is" +pageToGo);
    $(document).ready( function() {
        $(".nav li a:contains('OO')").parent().addClass('active');
    })
</script>

0 个答案:

没有答案