隱藏圖像在加載時間和顯示基於一個url參數值

Question

此頁面有圖像，這些圖像必須在加載時間隱藏，頁面從另一個aspx頁面接收參數值（不點擊任何按鈕）後，圖像顯示基於一個參數值。此代碼可以成功接收數據，但如何使用參數值隱藏和顯示圖像？

HTML：

<input type="button" id="mybutton" /> 
<script> 
$('#mybutton').click(function() { 
    $.ajax({ 
     url: 'About.aspx', 
     dataType: 'text', 
     type: "GET", 
     success: function(data) 
     { 
      var result = $.trim(data); 
      if (result = 2) { 
       $("image1").show(); 

      } else { 

       if (result = 3) { 

        $("image2").show(); 
       } 
      } 
     } 
    }); 
}); 
</script> 

    <div id="graphic"> 
    <img id="gate1" src="Img/Fully Close Green.png" /> 
    <img id="gate2" src="Img/Fully Close Red.png" /> 
</div> 

Answer 1

嘗試此代碼上document ready事件隱藏圖像或使用CSS類和圖像的與image1和image2，所述#標籤被用於訪問任何元件的ID和.然後用戶ID用於類設置display:none更chcek This： -

$(function() { 
$('#graphic img').hide(); 
$.ajax({ 
    url: 'About.aspx', 
    dataType: 'text', 
    type: "GET", 
    success: function (data) { 
     var result = $.trim(data); 
     if (result == 2) { 
      $("#gate1").show(); 

     } else if (result == 3) { 
      $("#gate2").show(); 
     } 
     //you can put more options here or just use else condition instread of else if 
    } 
}); 
}); 

Answer 2

您有不正確的比較邏輯。使用==或===而不僅僅是=。

另外，研究jQuery selectors。使用元素的ID。

if (result == 2) { 
    $("#gate1").show(); 
} else { 
    if (result == 3) { 
     $("#gate2").show(); 
    } 
} 

Answer 3

你要隱藏所有&只顯示了一個與「結果」值是否匹配？

$('#mybutton').click(function() { 
    $.ajax({ 
     url: 'About.aspx', 
     dataType: 'text', 
     type: "GET", 
     success: function(data) 
     { 
      var result = $.trim(data); 
      // Hide all 
      $('div#graphic img').hide(); 

      // Show matched one 
      $('#gate' + result).show(); 
     } 
    }); 
});