【解決方法】次の jquery コードを typescript に変換します

プログラミングQA

[ad_1]

$(document).ready(function(){
$(‘#channelType’).on(‘change’, function() {
if ( this.value == ‘1’)
{
$(“#internal”).show();
}
そうしないと
{
$(“#internal”).hide();
}
});
});

私が試したこと:

上記のjqueryスニペットをtypescriptに変更しようとしました

解決策 1

このコードにはいくつかの問題があります。まず、jQuery と JavaScript を混在させていることです。これは、私がここで話しているコンテキストです。 たとえば、ここを参照してください。

JavaScript
$('#channelType').on('change', function() {
   if (this.value == '1')
   { // ...

this 使用する必要があるものを参照するために、jQuery オブジェクトではなく JavaScript オブジェクトを参照します。 $(this) 物体。 したがって、他のすべてが問題なければ、jQueryで作業できるようにこれを解決できます。

JavaScript
$(document).ready(function(){
   $('#channelType').on('change', function() {
      if ($(this).val() == '1')
      {
          $("#internal").show();
      }
      else
      {
          $("#internal").hide();
      }
   });
});

これを機能させたい場合は、jQuery として機能するはずです。 そうでない場合は、HTML から始めて、多くのことを変更する必要があります。おそらく、要素は選択要素であるため、次のようになります。

HTML
<select id="channelType" onchange="channelChanged();">
   <!-- Internal content -->
</select>

次に、JavaScript のどこかに、次の関数を記述して、その要素の値の変更を処理します。

JavaScript
function channelChanged() {
    // We can also pass this to the function
    var channelType = document.getElementById("channelType");
    var internalObject = document.getElementById("internal");

    // Change the display of the element.
    if(channelType.value == '1') {
        internalObject.style.display = 'block';
    } else {
        internalObject.style.display = 'none';
    }
}

しかし、繰り返しますが、これはあなたが使いたいものですか? 🙂

onchange イベントの詳細については、こちらをご覧ください。 オンチェンジ – Mozilla | MDN[^]

[ad_2]

コメント

タイトルとURLをコピーしました