1

我想创建按钮以添加带有正文选项卡的选项卡
请查看上面显示的代码

$('#tabs1').tabs('add', 'lorem.txt', xxxxx' .....

如您所见'lorem.txt'，从检索信息以显示在正文选项卡中的位置，
我想将php代码和表单放入tabs body其中而不使用'lorem.txt'
问题是，如果我将 php 代码放入 jquery 它将不起作用。

php我的问题是，当人们单击按钮添加时，还有其他方法可以使用代码显示表单tabs吗？
我正在使用div标签。这是我的代码。 

<script>
(function() {
    $(function() {
        var tab_counter = 0;
        $('#tabs1').tabs({
            closable: true,
            cache:true,
            add: function(e, ui){
                $('#tabs1').tabs('select', '#' + ui.panel.id);
            }
        });
        $('#tab_creator').click(function(){
            tab_counter += 1;
            $('#tabs1').tabs('add', 'lorem.txt', 'Tab ' + tab_counter);
            return false;
        });
        $('#tabs2').tabs();
    });
})(jQuery);
</script>

</head>

<body>

<h2 class="ui-widget ui-widget-header">closable Tabs</h2>
<input id="tab_creator" type="button" value="Add New Tab">
<div id="tabs1">
    <ul>
    <li><a href="#tabs1-1">tabs one</a></li>
    <li><a href="#tabs1-2">tabs two</a></li>
    <li><a href="#tabs1-3">tabs three</a></li>
    </ul>
    <div id="tabs1-1">
        <p> tabs one body</p>
    </div>
    <div id="tabs1-2">
        <p>tabs two body</p>
    </div>
    <div id="tabs1-3">
        <p>tabs three body</p>
    </div>
</div>
<br>
<br>
4

1 回答 1

0

如果JS代码直接放在<head>（如你的例子）：

$('#tabs1').tabs('add', '<?php echo $filename; ?>', 'Tab ' + tab_counter);

否则，你需要这样的东西：

$('#tabs1').tabs('add', $( '#tabs1' ).attr( 'data-filename' ), 'Tab ' + tab_counter);

...您将 PHP 代码放在 #tabs1 中的 data-filename 属性中的位置：

<div id="tabs1" data-filename="<?php echo $filename; ?>">

关于数据属性：谷歌

于 2013-01-31T06:16:56.623 回答