1

jqcloud で Bootstrap を使用していますが、Bootstrap を追加すると jqcloud が機能しなくなります。この問題は、jquery のバージョンに関連しています。失敗したこのステートメントについて助けを求めています:

$("#headerwordcloud").jQCloud' is not a function
$("#headerwordcloud").jQCloud(hword_list);

JQCLOUDの場合 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script>
 <script type="text/javascript" src="./js/wordcloud.js"></script>
 <link rel="stylesheet" type="text/css" href="./css/jqcloud.css" />
<script type="text/javascript" src="./js/jqcloud-1.0.4.js"></script>

ブートストラップの新しいコード 

    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
    <!--[if lt IE 9]>
      <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link rel="shortcut icon" href="/bootply_ico.jpg">
    <link rel="apple-touch-icon" href="/bootstrap/img/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="72x72" href="/bootstrap/img/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114" href="/bootstrap/img/apple-touch-icon-114x114.png">

  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>

    <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
    <script src="/plugins/jquery.layout.js"></script>

    <link href="/plugins/jquery.layout.css" rel="stylesheet">
    <link rel="stylesheet" href="/plugins/bootstrap-select.min.css">
    <link rel="stylesheet" href="/css/bootply.css">
    <link rel="stylesheet" href="/bootply/themes/metroid/theme.css">
4

1 に答える 1

0

jQuery を 2 回目にロードしたときに/オブジェクトjQCloudに追加されるメソッドを上書きしている時点でスクリプトをロードしている方法。最初に jQuery と jQuery UI をロードしてから、それらに応じてプラグインを追加します。jQuery$

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="./js/wordcloud.js"></script>
<script type="text/javascript" src="./js/jqcloud-1.0.4.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
<script src="/plugins/jquery.layout.js"></script>

この例ではスタイルシートを省略していることに注意してください。

jQCloud が古いバージョンの jQuery を必要とする (ありそうもない) ケースでは、次のようなアプローチを使用できます。

于 2013-07-18T13:39:36.447 に答える