1

初学者。我有一些选项卡，每个选项卡的内容都是从文本文件动态加载的。因此，单击每个选项卡，为该选项卡加载带有内容的文本文件。

$('#thisMainTabs').tabs({selected:0});

<div id='thisMainTabs'>
<ul>
<li><a href='/scripts/thisMainTabs1.txt'>Tab 1 Content</a></li>
<li><a href='/scripts/thisMainTabs2.txt'>Tab 2 Content</a></li>
<li><a href='/scripts/thisMainTabs3.txt'>Tab 3 Content</a></li>
<li><a href='/scripts/thisMainTabs4.txt'>Tab 4 Content</a></li>
<li><a href='/scripts/thisMainTabs5.txt'>Tab 5 Content</a></li>
</ul>
</div>

我想尽可能基本。在其中一些选项卡中，我有 jQuery 按钮，它们也是非常基本的

文件内准备好：

$('#btnNumber1').button({icons: {primary: 'ui-icon-circle-plus' secondardy: null} });

$('#btnNumber1').click(function () {
     alert('working');
});


<div id='btnNumber1'>add new<div>

所以作为一个例子，我只是使用了这些警报，但实际上这些东西打开了对话框（是的 jquery 对话框也是如此）。似乎正在发生的事情是，第一次选择的每个选项卡都会呈现按钮并且它将起作用，但是如果我返回选项卡，按钮就在那里，但单击时不执行任何操作。不确定是对话框还是按钮？但一切都是第一次通过。

我是新手，非常感谢您对此的任何帮助。谢谢！

编辑：应该再澄清一些事情。道歉。

所以上面的 .tabs() 和 #thisMainTabs 是主页面内容中唯一的东西。除了默认的选项卡内容......真的只有文字。在其他每个选项卡中（大约还有 5 个）我有指向文本文件链接的 href。这些文本文件中的每一个都包含该选项卡内容（标记、js、css 等），并且在每个文件中我都有一个 $(document).ready.... 这有点奇怪，但其他一切似乎去工作？？我将再次声称初学者:)。所以我有手风琴，我有按钮，我有对话框（所有 jQ），一切都工作正常，直到我注意到上述行为。如果我第一次选择每个选项卡，内容就会加载，按钮就在那里，我点击它，它就可以工作（大多数是对话框）。在选项卡之间切换，只要第一次单击该选项卡，它们都可以工作。

但是，如果我回到一个选项卡，按钮就在那里，但什么也不做。

我上面的例子是我如何使用所有将它们视为按钮的按钮并设置点击功能的示例。这些中的每一个都在文档中为每个选项卡的每个文本文件准备好。我对所有 ID 进行了两次和三次检查，以确保一切都是独一无二的；使用 ID 到了极端，以确保不会发生这种情况，因为它有很多脚本。反正对我来说......

更新：不确定是我遇到问题的按钮还是对话框，上述问题似乎与那些触发对话框的按钮无关。还是一样的，第一次还好，第二次就不行了。向某些附加警报，并且效果很好。

对话框是这样构建的（也完全在文本文件中，并且在该文本文件的文档准备就绪上）。

$('#thisDialogDiv').dialog({ 
                        resizable:false, 
                        width:200, 
                        modal: true, 
                        autoOpen: false, 
                        buttons: { 
                        "Ok": function() { $(this).dialog("close"); } } 
                        }); //not bothering with buttons

<div id="thisDialogDiv">
<h3>Here is the Title</h3>
<p>Here is some content on the dialog</p>
</div>

在上面引用的按钮上调用这样的对话框

$('#btnNumber1').click(function () {
    $('#thisDialogDiv').dialog("open");
});

这基本上是每个实例的......我猜很基本。

4

1 回答 1

2

我想我现在更好地理解了你的问题。

每个选项卡中都有div一个id="btnNumber1"。但是这些选项卡都存在于同一个窗口（或更准确地说是框架）中，并且 htmlid在给定文档中必须是唯一的。

因此，您需要btnNumber2在第二个选项卡、btnNumber3第三个选项卡等中提供按钮 id =。它仅适用于您的第一个选项卡的原因是您的所有代码都是找到 DOM 中存在的第一个。

编辑：

贾斯汀，如果您在父文档中进行委托绑定怎么办？例如：

$('#thisMainTabs').on('click', '#btnNumber1', function() { alert('Button 1 clicked'); });

那么这会 100% 触发吗？我并不是说这是解决方案...我认为您将相关代码与内容保持在一起很好...否则它会成为维护的噩梦，但我觉得按需发生的事情加载....也许在.ready()第一次加载选项卡后没有触发？不知道，制作 WAG ;)

于 2012-08-31T12:49:18.117 回答