0

WordPress プラグインの設定ページで jQuery ajax フォーム プラグインを使用しています。ajax を使い始める前は、テキスト入力値とプレースホルダー値を比較し、一致した場合はテキスト入力値を null に設定するスクリプトを使用していました。しかし、私は ajax を使用しているため、もはや機能しません。jQuery ajax フォーム プラグインを使用すると、beforeSerialize 関数または beforeSubmit 関数で引数を渡すことができます。beforeSerialize で行う必要があると思います。とにかく、私はこれを機能させる方法がわかりません。ajaxに切り替える前に機能していたスクリプトは次のとおりです。

 $('[placeholder]').focus(function() {
     var input = $(this);
     if (input.val() == input.attr('placeholder')) {
         input.val('');
         input.removeClass('placeholder');
     }
 }).blur(function() {
     var input = $(this);
     if (input.val() == '' || input.val() == input.attr('placeholder')) {
         input.addClass('ssfa-placeholder');
         input.val(input.attr('placeholder'));
     }
 }).blur().parents('form').submit(function() {
     $(this).find('[placeholder]').each(function() {
         var input = $(this);
         if (input.val() == input.attr('placeholder')) {
             input.val('');
         }
     })
 });

そして、これがajaxフォーム送信用の現在のスクリプトです。

var svn = $("#ssfa-saving"),
bck = $("#ssfa-saving-backdrop"),
svd = $("#ssfa-settings-saved");

$("#ssfa-form").ajaxForm({
    beforeSend: function() {
        svn.fadeIn('slow');
        bck.fadeIn('fast');
    },
    success: function(){ 
        svn.fadeOut('slow');
        svd.delay(1000).fadeIn('slow').delay( 2500 ).fadeOut('slow');
        bck.delay( 4500 ).fadeOut('slow'); 
    }
});

プレースホルダー値を無視するために ajax 送信 (beforeSerializeまたは) を取得する方法についてのアイデアはありますか? beforeSend上記の最初のスクリプトは、通常の投稿送信に対する非常に単純なソリューションです。ajaxと同じくらい簡単なものを見つけられることを願っています。

アップデート

私はそれを行う基本的な方法を考え出しましたが、プレースホルダーを持つ各テキスト フィールドを呼び出す必要があるため、元のスクリプトのようにエレガントではありませんが、これは機能します。

$("#ssfa-form").ajaxForm({
    beforeSerialize: function() {
        var permex = $('input#exclusions');
        $('input[id^=bs]').each(function(){
            var bs = $(this);
            if (bs.val() === 'Display Name')
                bs.removeAttr('value');
        });
        $('input[id^=custom_]').each(function(){
            var cs = $(this);
            if (cs.val() === 'classname1|Display Name 1, classname2|Display Name 2')
                cs.removeAttr('value');
        });
        if (permex.val() === '.avi, My Embarrasing Photograph, .tif')
            permex.removeAttr('value');
    },

    beforeSend: function() {

    etc.

これはプレースホルダー テキストであるため、value 属性が削除されてもテキストは実際には消えません。私はこれで月を越えていませんが、うまくいきます。私がもっと大きなフォームを持っていたら、これはうまくいきません。

より良いアイデアを受け入れる....

4

1 に答える 1

0

さて、私はそれをかなりいじって、元のコードを ajax submit で動作させる方法を見つけました。実際には非常に簡単です。プレースホルダー attr を検索する要素を指定する必要がありました。ここにあります：

        beforeSerialize: function() {
            $("#ssfa-form").find('[placeholder]').each(function() {
                var input = $(this);
                if (input.val() == input.attr('placeholder')) {
                    input.val('');
                }
            })
        },
        etc.

問題を追跡するには、以下を参照してください。

https://github.com/mathiasbynens/jquery-placeholder/issues/30 https://github.com/mathiasbynens/jquery-placeholder/issues/197

于 2013-11-04T09:05:12.940 に答える