0

プロジェクトの1つにjQueryiToggleプラグインを使用しようとしています。しかし、それは正しく機能していないようです。最初にコードに取り掛かり、次に問題を説明します。

HTML<head>セクション::

<link rel="stylesheet" href="http://localhost/projects/mythadmin/wp-admin/load-styles.php?c=1&amp;dir=ltr&amp;load=admin-bar,wp-admin&amp;ver=3.4.2" type="text/css" media="all">
<link rel="stylesheet" id="thickbox-css" href="http://localhost/projects/mythadmin/wp-includes/js/thickbox/thickbox.css?ver=3.4.2" type="text/css" media="all">
<link rel="stylesheet" id="myth_admin_stylesheet-css" href="http://localhost/projects/mythadmin/wp-content/themes/mythadmin/mythadmin/css/mythadmin.css?ver=3.4.2" type="text/css" media="all">
<link rel="stylesheet" id="myth_itoggle_stylesheet-css" href="http://localhost/projects/mythadmin/wp-content/themes/mythadmin/mythadmin/css/engage.itoggle.css?ver=3.4.2" type="text/css" media="all">
<link rel="stylesheet" id="myth_admin_colorpicker_stylesheet-css" href="http://localhost/projects/mythadmin/wp-content/themes/mythadmin/mythadmin/colorpicker/css/colorpicker.css?ver=3.4.2" type="text/css" media="all">
<link rel="stylesheet" id="colors-css" href="http://localhost/projects/mythadmin/wp-admin/css/colors-fresh.css?ver=3.4.2" type="text/css" media="all">
<script type="text/javascript" src="http://localhost/projects/mythadmin/wp-admin/load-scripts.php?c=1&amp;load=jquery,utils&amp;ver=3.4.2"></script>
<script type="text/javascript" src="http://localhost/projects/mythadmin/wp-content/themes/mythadmin/mythadmin/js/jquery.easing.js?ver=3.4.2"></script>
<script type="text/javascript" src="http://localhost/projects/mythadmin/wp-content/themes/mythadmin/mythadmin/colorpicker/js/colorpicker.js?ver=3.4.2"></script>
<script type="text/javascript" src="http://localhost/projects/mythadmin/wp-content/themes/mythadmin/mythadmin/js/engage.itoggle.js?ver=3.4.2"></script>
<script type="text/javascript" src="http://localhost/projects/mythadmin/wp-content/themes/mythadmin/mythadmin/js/mythadmin.js?ver=3.4.2"></script>

ここでは、すべてのファイルが。なしで正しくロードされています404s。

HTML本文::

<div class="myth_option_container toggle">
    <label for="test_cb">Test Checkbox</label>
    <input type="checkbox" id="test_cb" name="test_cb">
</div>

iToggle関数の呼び出し

$(document).ready(function(){
   // Initialize iToggle Checkboxes
   $('input#test_cb').iToggle({
        easing: 'easeOutExpo',
        speed: 300
    });
});

上記のコードはmythadmin.js、セクションの最後に含まれているファイルから呼び出されていますhead。

これはまったく機能していないようです。コンソールにエラーはありません。すべてのファイルが正しくロードされていますが、トグルボタンが表示されません。

をターゲットにするinput's parent containerと、トグルボックスが表示され、オンとオフを切り替えることができますが、easing効果はありません（何らかの理由で）。

だから私がそれに変更$('input#test_cb')した場合はうまくいくと言い$('div.toggle')ます（イージング効果はまったくありません）。

質問：

  1. チェックボックス入力に直接バインドすると、なぜこれが機能しないのですか。
  2. easing.js正しくロードしてもイージング効果が効かないのはなぜですか。

よろしくお願いします！

4

1 に答える 1

3

ここでも同じ問題があります。古いバージョンのjQuery（1.4.2-min）を試してみてください。正常に動作しますが、1.8.2ではうまく動作しないようです...

編集済み：iToogle <このバージョンのiToggleは、新しいバージョンのjQueryで動作するはずです。

于 2012-10-23T14:28:54.593 に答える