0

このコードを作成してから数日が経ちましたが、改善することは可能だと思います。誰かがよりスマートな方法を作成するのを手伝ってくれませんか?

// Hide registered or customized field if not checked.
function checkUserType(value) {
  if (value == 2) {
    $('#registered').hide();
    $('#customized').show();
  } else if (value == 1) {
    $('#registered').show();
    $('#customized').hide();
  }
}

checkUserType($('input:radio[name="jform[place_type]"]:checked').val());

$('#jform_place_type').on('click', function () {
  checkUserType($('input:radio[name="jform[place_type]"]:checked').val());
});

デモ: http://jsbin.com/emisat/3

4

3 に答える 3

0

http://api.jquery.com/toggle/

    $('#jform_place_type').on('click', function () {
//show is true if the val() of your jquery selector equals 1
// false if it's not
      var show= ($('input:radio[name="jform[place_type]"]:checked')
        .val()==1);
//set both divs to visible invisible / show !show(=not show)
// (not show) means that if show=true then !show would be false
      $('#registered').toggle(show);
      $('#customized').toggle(!show);
    });

セレクターが複数回必要な場合は、それをキャッシュします。クラウディオがすでに述べたように、オブジェクトキャッシングと呼ばれていると思います。そのため、多くのものが表示されます。

$this=$(this);
$myDivs=$("some selector");

jquery 関数 (jquery オブジェクト) の結果を保持する変数の慣例では、$ で始まりますが、これは単なる変数名であるため、好きなように呼び出すことができます。

me=$(this);
myDivs=$("some selector");
于 2013-02-02T15:12:20.967 に答える
0 
// Hide registered or customized field if not checked.
function checkUserType(value) {

}

var t = function () {
  var value = $('input:radio[name="jform[place_type]"]:checked').val();
  if (value == 2) {
    $('#registered').hide();
    $('#customized').show();
  } else if (value == 1) {
    $('#registered').show();
    $('#customized').hide();
  }
};

$('#jform_place_type').on('click', t);
于 2013-02-02T14:54:33.560 に答える
0

DOM 要素を保存し、残りをキャッシュすることで、(パフォーマンスのために) Jquery を改善できます。これは、私が推測できる最大のものです。

function checkUserType(value) {
  var r = $("#registered");
  var c = $("#customized");
  if (value == 2) {
    r.hide();
    c.show();
  } else if (value == 1) {
    r.show();
    c.hide();
  }
}

var func = function () {
  checkUserType($('input:radio[name="jform[place_type]"]:checked').val());
};

$('#jform_place_type').on('click', func);

さらに読むには、このJQuery Performanceを確認してください

特に、ドキュメントの 3 番目の段落を読んでください。

jQuery オブジェクトをキャッシュする

jQuery オブジェクトを変数に保存する習慣を身につけてください (上の例のように)。たとえば、次のことは絶対に (eeeehhhhver) しないでください。

$('#traffic_light input.on').bind('click', function(){...});
$('#traffic_light input.on').css('border', '3px dashed yellow');
$('#traffic_light input.on').css('background-color', 'orange');
$('#traffic_light input.on').fadeIn('slow');

代わりに、最初にオブジェクトをローカル変数に保存し、操作を続行します。

var $active_light = $('#traffic_light input.on');
$active_light.bind('click', function(){...});
$active_light.css('border', '3px dashed yellow');
$active_light.css('background-color', 'orange');
$active_light.fadeIn('slow');

ヒント: ローカル変数が jQuery でラップされたセットであることを覚えておきたいので、接頭辞として $ を使用しています。アプリケーションで jQuery の選択操作を 2 回以上繰り返さないでください。

于 2013-02-02T14:55:48.860 に答える