9

我正在使用 Twitter Bootstrap，但我似乎无法更改按钮状态。

我正在从http://jsfiddle.net/YCst4/1/复制 js，但没有收到回复。就像我没有加载 jQuery，但我在我的标题中加载了 bootstrap.min.js。我对页面上的其他 javascript 没有任何问题。

这就是我在 Codeigniter 视图中的内容：

<script>
$('#button').button();

$('#button').click(function() {
    $(this).button('loading');
});
</script>

<button class="btn" id="button" type="button" data-text-loading="Loading...">Press Me</button>

关于造成这种情况的任何想法？bootstrap-button.js 不是 Bootstrap 附带的 bootstrap.min.js 的一部分吗？

http://twitter.github.com/bootstrap/javascript.html#buttons

编辑：

当我查看页面的源代码时，我可以看到在标题视图中加载了 bootstrap.min.js，我可以单击它来查看它的源代码，所以路径是正确的。但是，按钮 js 代码仅在我<script src="http://site.dev/assets/admin/js/bootstrap.min.js"></script>在实际内容视图本身中重复时才有效。

我让 jQuery 在 bootstrap.min.js 上方加载了一行，并且与按钮在同一视图中的 jQuery 元素可以正常工作。我难住了。

4

5 回答 5

14

我在 bootstrap.min.js 之后加载了 jquery-ui-1.8.21.custom.min.js。显然有些冲突。

于 2012-07-05T18:38:53.980 回答
9

您需要将代码放在文档就绪函数中，以便它在页面准备好之后运行，而不是之前。

$(document).ready(function(){
  $('#button').button();

  $('#button').click(function() {
    $(this).button('loading');
  });  
});

JS Fiddle 似乎会自动为您执行此操作，这就是它在那里工作的原因。

于 2012-07-03T18:54:03.010 回答
2

您试图在按钮成为 DOM 的一部分之前将单击绑定到按钮。把你的东西放在文档准备功能中，你应该没问题。

于 2012-07-03T18:51:17.320 回答
2

对于像我这样的 javascript 新手：您还需要在定义之前加载 jQuery$('#button').click()

于 2013-06-25T14:31:13.493 回答
0

我最近遇到了同样的问题。以下是一些可能对您有所帮助的事情：

  1. 您是否以必要的顺序加载您的 js 文件。列出的顺序（作为脚本标签）必须是正确的（基于依赖的）顺序，如下所示：

    <script src="jquery.js"></script>
<script src="bootstrap.js"></script>
<script src="button_app.js."></script>

  2. 您使用的是本地还是远程 css/js 文件？如果您使用的是远程的。检查其中是否有任何引用 github。如果它们看起来像这样：

    <script src="https://raw.github.com/twitter/bootstrap/master/js/bootstrap-alert.js"></script>

    他们不会工作。Chrome 会抛出一个 mime 类型错误。

于 2013-06-05T13:37:27.453 回答