使用removeAttr不適用於我

我有一個圖像，在您用鼠標懸停後顯示。當我點擊圖像時，我希望圖像通過使用removAttr方法保持不動。但使用removeAttr似乎不適用於我....感謝您的任何建議。使用removeAttr不適用於我

這裏是我的HTML標記

<table class="ovalControl"> 
    <tr> 
     <td class="oval"> 
     </td> 
     <td class="ovalSibling" align="center" > 
      <div id="divOvalSibling" style="height:15px; width:30px;"> 
       <img id="imgOvalSibling" 
        height="15px" 
        width="30px" 
        src="../Images/sib.PNG" 
        alt="" 
        onclick="respond0(); return false;" 
        style="display:none"/> 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td class="ovalChildWidth" align="center"> 
      <div id="divOvalChild" style="height:25px; width:20px;"> 
      <img id="imgOvalChild" 
       height="25px" 
       width="20px" 
       src="../Images/Child.PNG" 
       alt="" 
       onclick="respond1(); return false;" 
       style="display:none"/> 
      </div> 
     </td> 
     <td class="blank"> 
      &nbsp;</td> 
    </tr> 
</table>

這裏是我的jQuery代碼：

<script language="javascript" type="text/javascript"> 

     var prmRegister = Sys.WebForms.PageRequestManager.getInstance(); 
      prmRegister.add_initializeRequest(initializeRequest); 
      prmRegister.add_endRequest(endRequest); 

     $(document).ready(function() { 
      $('#divOvalSibling').hover(
      function() {$('#imgOvalSibling').show();}, 
      function() {$('#imgOvalSibling').hide();}) 
     }) 

     $(document).ready(function() { 
      $('#divOvalChild').hover(
      function() { $('#imgOvalChild').show();}, 
      function() { $('#imgOvalChild').hide();}) 
     }) 

     function initializeRequest(sender, args) { 
     } 

     function endRequest(sender, args) {    
     } 

     function respond0() { 

      var startX = $("#imgOvalSibling").offset().left + 15; 
      var startY = $("#imgOvalSibling").offset().top + 7; 

      $("#respond0").drawLine(startX, startY, 850, 250); 
      $("#imgOvalSibling").removeAttr("style"); 
     } 

     function respond1() { 

      var startX = $("#imgOvalChild").offset().left + 10; 
      var startY = $("#imgOvalChild").offset().top + 12; 

      $("#respond1").drawLine(startX, startY, 400, 500); 
      $("#imgOvalChild").removeAttr("style"); 

     } 

    </script>

感謝，邁克爾

來源

2011-06-10 MdeVera

你到底想達到什麼目的？我懷疑你可以用這種方式刪除整個「樣式」屬性，因爲它很特殊。 – Pointy 2011-06-10 20:19:55

我只想讓圖片在您點擊圖片後保持顯示。 – MdeVera 2011-06-10 20:28:41

您可以在單擊事件上解除懸停。這樣做可以防止鼠標移動事件，圖像將保留在視圖中。

$('#imgOvalSibling').click(function() { 
    $('#divOvalSibling').unbind('mouseenter mouseleave'); 
});

演示：http://jsfiddle.net/wdm954/YG6pq/1/

來源

2011-06-10 21:36:16 wdm

@wdm ....非常感謝你！非常好的演示！ – MdeVera 2011-06-13 14:52:42

$("#imgOvalSibling").attr("style","");

也是其更好地綁定的事件，而不是使用內聯javascript

$("#imgOvalChild").click(function() { respond1(); });

如果你想顯示一個元素與顯示：無;你可以：

$("#imgOvalSibling").show();

來源

2011-06-10 20:35:24 braindamage

我用綁定實現了你的建議，並嘗試$（「＃imgOvalSibling」）。attr（「style」，「」）;但圖像不會保持可見。 – MdeVera 2011-06-10 20:49:28

看來，問題是，當你不徘徊在#divOvalSibling或#divOvalChild元素，圖像獲取隱藏。您可以刪除樣式，但在此之後，事件處理函數會啓動並在圖像上設置display：none。

快速解決將是有你的響應函數設置在圖像上的一些數據：

function respond0() { 
    var startX = $("#imgOvalSibling").offset().left + 15; 
    var startY = $("#imgOvalSibling").offset().top + 7; 

    $("#respond0").drawLine(startX, startY, 850, 250); 
    /* You set the flag on the image */ 
    $("#imgOvalSibling").data("isShown", true) 
}

你修改你的懸停事件處理程序隱藏圖像之前檢查標誌：

$(document).ready(function() { 
    $('#divOvalSibling').hover(
    function() {$('#imgOvalSibling').show();}, 
    function() { 
     if (!$('#imgOvalSibling').data("isShown")) { 
      $('#imgOvalSibling').hide(); 
     } 
    }) 
})

來源

2011-06-10 21:30:20 skajfes

使用removeAttr不適用於我

回答

相關問題