2

私はjQtransformに影響を与えるバグに苦しんでいます：

チェックボックスに関連付けられたラベルをクリックすると、ボックスが「視覚的に」チェックされますが、フォームを送信すると、送信されません。（したがって、jqTransformレイヤーのみをチェックし、実際のチェックボックスはチェックしません）

  • ラジオで同じシナリオを考えると->それは機能します

  • チェックボックスの直接クリック->それは機能します

    $.fn.jqTransCheckBox = function(){
return this.each(function(){
    if($(this).hasClass('jqTransformHidden')) {return;}

    var $input = $(this);
    var inputSelf = this;

    //set the click on the label
    oLabel = jqTransformGetLabel($input);
    oLabel && oLabel.click(function(){aLink.trigger('click');}); // -> Bug here ?

    var aLink = $('<a href="#" class="jqTransformCheckbox"></a>');
    //wrap and add the link
    $input.addClass('jqTransformHidden').wrap('<span class="jqTransformCheckboxWrapper"></span>').parent().prepend(aLink);
    //on change, change the class of the link
                $input.change(function(){
                  inputSelf.checked && aLink.addClass('jqTransformChecked') || aLink.removeClass('jqTransformChecked');
                  return true;
                });
    // Click Handler, trigger the click and change event on the input
    aLink.click(function(){
        //do nothing if the original input is disabled
        if($input.attr('disabled')){return false;}
        //trigger the envents on the input object
                        $(this).toggleClass('jqTransformChecked');
        $input.trigger('click').trigger("change");
        return false;
    });

    // set the default state
    this.checked && aLink.addClass('jqTransformChecked');
});

    };

ありがとう

4

5 に答える 5

3

aLink.trigger('click')なんらかの理由で通話が機能していないようです。この行を置き換えることでこれを修正しました：

oLabel && oLabel.click(function(){aLink.trigger('click');});

次のように：

oLabel && oLabel.click(function(){
    var forAttr = null;
    if(forAttr = $(this).attr('for')) {
        var element = $(this).siblings('#' + forAttr);
        if(element.length) {
            element.trigger('click');
        }
    }
    else {
        aLink.trigger('click');
    }
});

これは、ラベルの兄弟の「for」属性の要素をチェックインし、要素が存在する場合は、aLinkの代わりにそれを使用します。ドキュメント全体を検索するよりも高速であるため、兄弟を使用しています。必要に応じて自由に変更してください。

お役に立てれば。

編集：さて、私はこの答えでそれに突入したかもしれません。私の解決策は多くのレベルで間違っています。

私が実際に起こっていると思うのは、ラベルをクリックするとダブルクリックが発生するということです。したがって、ラベルをクリックすると、要素をチェックするデフォルトのクリックがトリガーされ、その直後にチェックボックスのチェックを外す別のクリックがトリガーされます。

私の以前の解決策は実際には何もしていませんでした。条件が実際には発生しなかったため、2回目の呼び出しを防ぐだけでした（「＃」+ forAttr要素は兄弟ではありません）。

エラーのある行をコメントアウトするだけで、この問題が修正されることがわかりました。

于 2012-11-06T13:50:06.853 に答える
1

それが同じ問題かどうかはわかりませんが、ラジオボタンが変換されたときに、ラベルをクリックすると、投稿された値は正しいものの、すべてがチェックされます。

問題はjqTransformGetLabelにあるように思われます。

next（）を使用してラベルを取得しようとしますが、それが機能しない場合は、prev（）を使用します。これは、DOM内で1レベルだけ移動します。変化

var oLabel = objfield.next();

に

var oLabel = $(objfield.find('label').get(0));

と

oLabel = objfield.prev();

に

oLabel = $(objfield.parents('label').get(0));

jqTransformGetLabelの内部で問題が解決したようです。

于 2012-04-20T14:01:25.043 に答える
1

私が発見したのはこれです

<input type="checkbox" name="sexi" id="test" />
<label>Female</label>

動作しますが、これ

<input type="checkbox" name="sexi" id="test" />
<label for="test">Female</label>

しません

どちらもラジオ入力で機能します！

最初のアプローチが機能する理由は、チェックボックスの場合、ラベルをクリックするとクリックが2回発生するためです。

コードのバグを修正しようとしていますが、ラジオとチェックボックスに同じコードが使用されています...うーん。

于 2012-01-30T16:23:26.183 に答える
0

Vlad Cazacuが述べたように、問題はダブルクリックによって引き起こされます（デフォルトのものとクリック機能で呼び出されるもの）。

デフォルトのイベントを回避するには、falseを返す必要があります。

oLabel && oLabel.click(function () { aLink.trigger('click'); return false; });

少なくともそれは私のために働いた:)

于 2014-09-02T10:52:17.140 に答える
0

これは私の場合とは異なりますが、このページが同じ問題の解決策を見つけようとしているのを見つけました（フィールドは送信されません）。違いは、テーブル内のどの行がチェックされたかを識別するためだけに、ラベルなしでjQtransformを使用していることです。

私のようにここに到着した誰かがいくつかの良いヒントを探しているのを助けるために、このソリューションを投稿しています;）

kbalcerekが行ったように（元のファイルの）行140を変更しました。

oLabel && oLabel.click(function(){aLink.trigger('click'); return false;});

次に、input.changeイベント（147行目）内でこれを変更しました...

this.checked && aLink.addClass('jqTransformChecked') || aLink.removeClass('jqTransformChecked');

...これに：

$(this).attr('checked') && aLink.addClass('jqTransformChecked') || !$(this).attr('checked') && aLink.removeClass('jqTransformChecked');

そして最後に、aLink.clickイベント（155行目）内でこれを変更する必要がありました...

$input.trigger('click').trigger("change");

...それに：

$input.attr('checked', !$input.attr('checked')).trigger("change");

最後の2つの変更で、私のインスピレーションは、「チェックボックスのオン/オフの切り替え」という質問に対するフレデリックハミディの回答から得られました。

私のために解決=）誰かを助けたい

于 2020-11-20T05:51:32.137 に答える