2

Wordpressにページとして追加したときにjqueryコードが機能しない理由を理解するために、数時間努力してきました。

スタンドアロンページとしてはすべて正常に機能しますが、Wordpressページに変換するとjQueryクリックイベントは発生しなくなります。

私のjQueryコードは現在次のようになっています:

jQuery(document).ready(function() {
    jQuery('button#convert').click(function() {
        alert("test");
        var text = jQuery('textarea#textInput').val();
        var method = jQuery('select#methodOptions').val();

        if (text!='')
        {
            $.ajax({
                url: 'core/convert.php',
                type: 'POST',
                data: 'data=' + text + '&method='+ method,
                dataType: 'html',
                success: function( message) {
                    jQuery('textarea#textOutput').val(message);
                }
            });
        }
    });
});

私のボタンはhtmlでこのように見えます

<button id="convert" class="convertbutton" type="button">Convert</button>

また、上記のスクリプトを含む.jsファイルがヘッダーに正しく読み込まれていること、およびjqueryライブラリも正しく読み込まれていることを確認できます。私は何かが足りないのですか?前もって感謝します。

編集:問題が何であるかを見つけました。Wordpressはヘッダーに.jsをロードしていたフッターにjqueryライブラリをロードしていました。これが、明らかな理由でスクリプトを呼び出す前にライブラリをロードする必要があるため、問題が発生した理由です。 。

また、$。ajaxはnoConflictモードのjQuery.ajaxである必要があります。

4

2 に答える 2

5

この問題は、コードのエラーよりも単純ではないように見えました。Wordpressプラグインの1つは、読み込み時間を改善するために、.jsファイルの大部分をヘッダーではなくフッターに読み込むように強制していました。

問題は、ヘッダーに.jsファイルをロードしていたため、jqueryライブラリがロードされる前にjavascriptコードが実行され、エラーが発生したことです。

add_action('wp_head', '<js method>');解決策は、.jsファイルがフッターにロードされていることを確認することでした。これは、に変更することで実現できますadd_action('wp_footer', '<js method>');。また、コードに小さなエラーがありました。jqueryが競合モードにない場合は、で$.ajaxある必要がありますjQuery.ajax

于 2013-03-19T15:10:20.600 に答える
0

試す:

if (text != 'undefined')

また

if (text != null)

AJAXの例については、こちらをご覧ください。

編集:

クリック機能のセレクターの前にある「ボタン」を取り出します。(button#convertではなく#convert) .findもチェックしてください

HTMLの本文にjqueryが含まれていることを確認してください。可能であればフィドルを含めてください。

過去にもJquery()で問題が発生しました。次のようにコードを記述します。

$(document).ready(function(){
// etc etc
$('#convert').click( //etcetc

于 2013-03-18T22:58:30.903 に答える