問題點擊事件jQuery的

我敢肯定這是愚蠢的事情，但ID不知道我在做什麼錯問題點擊事件jQuery的

我有創造的一個表與一些元素的面板ASP的方法。另外我有兩個事件，懸停和單擊懸停工程太偉大，但CSS，我需要設置元素不會出現時，即使它是點擊。我做錯了什麼，因爲我把一個警報在功能，並正常工作。感謝您的時間下面的mi代碼。

function buildImageGallery(data) { 

//boring code 
$(".pnlImage tr").remove(); 
var tableSelector = '<table class="tableFinder" id="imageSelectorPanel">'; 
tableSelector = tableSelector + '<tr>'; 
var imagesData = data.d.split(";"); 
for (var i = 0; i < imagesData.length; i++) { 
    if (i != imagesData.length - 1) { 
     var image = imagesData[i].split(","); 
     tableSelector = tableSelector + '<td>' + '<div id="' + image[0] + '" ' 
      + 'class="imagePanel" style="background:url(' + image[1] 
      + ');background-repeat:no-repeat;margin-left:auto;margin-right:auto;margin-top:auto;margin-bottom:auto;">' + "</div>" + "</td>"; 
    } 
} 

tableSelector = tableSelector + '</tr>'; 
tableSelector = tableSelector + '</table>'; 
$(".pnlImage").append(tableSelector); 
//the two events 
$(".imagePanel").hover(mouseOver, mouseOut); 
$(".imagePanel").click(setElement); 
} 

function mouseOver() { 
$(this).stop(true, true).animate({ 
    opacity: 0.25 
}, 100, function() { 
    $(this).css('border', '2px solid black'); 
}); 
} 

function mouseOut() { 
$(this).stop(true, true).css('border', '0 none').animate({ 
    opacity: 1 
}, 100); 
} 
//this method executes but don't add the style 
function setElement() { 
// alert("click the element with id: " + this.id); 
$(this).css('border', '2px solid black'); 

}

來源

2011-05-26 Jorge

你的問題真的不清楚。你能否嘗試校對你寫的內容並對其進行修改？ – 2011-05-26 23:23:07

我強烈建議_not_在代碼中使用如此多的'html'標記。 – pixelbobby 2011-05-26 23:28:52

@Matt球嗨，在簡歷中，我不知道爲什麼在我的事件點擊不設置的CSS樣式，我把我的代碼 – Jorge 2011-05-26 23:30:11

看起來來自click事件的樣式將被來自懸停事件的樣式覆蓋。因此要點擊div，您首先觸發mouseOver()，並將邊框設置爲2px solid black。然後單擊，並且setElement()函數將邊框重新設置爲2px solid black。你沒有看到任何改變。然後，將光標移出div以查看更改，然後觸發mouseOut()這將刪除邊框。

我假設你想要的是邊界一旦div被點擊後堅持。你可以在div上設置某種數據屬性來表示它被選中。

function setElement() { 
    $(this).css('border', '2px solid black').data('selected', true); 
}

然後檢查mouseOut()函數。

function mouseOut() 
{ 
    if (!$(this).data('selected')) { 
     $(this).stop(true, true).css('border', '0 none').animate({ opacity: 1}, 100); 
    } 
}

來源

2011-05-26 23:34:22 AaronShockley

乾淨而乾淨！ – mrk 2011-05-26 23:42:44

鼠標懸停功能設置相同的CSS邊界，因此，或許setElement被執行，但由於邊界已經是「2px的純黑色」你沒有看到setElement的變化還嘗試設置邊界「的2px純黑「。

試試這個嗎？
在setElement中，將邊框設置爲「3px純紅色」。

來源

2011-05-26 23:27:45 mrk

考夫曼我看到問題集的CSS，但元素有你當你外出時懸停使功能，它有一種方法來驗證它是什麼時候點擊不要做mouseOut – Jorge 2011-05-26 23:34:10

問題點擊事件jQuery的

回答

相關問題