मुझे माउस पर एक टेबल पंक्ति को हाइलाइट करने की आवश्यकता है। ऐसा करने के लिए एक आसान पर्याप्त चीज़ की तरह लगता है, है ना? विशेष रूप से jQuery का उपयोग कर। लेकिन हां, मैं बहुत भाग्यशाली नहीं हूँ।jQuery हाइलाइट टेबल पंक्ति
मैं एक तालिका पंक्ति पर प्रकाश डाला के लिए अलग अलग समाधान परीक्षण किया है, लेकिन कुछ भी
:-(मैं निम्नलिखित स्क्रिप्ट का परीक्षण किया है काम करने के लिए लग रहे हैं:
// TEST one
jQuery(document).ready(function() {
jQuery("#storeListTable tr").mouseover(function() {
$(this).parents('#storeListTable tr').toggleClass("highlight");
alert('test'); // Just to test the mouseover event works
});
});
//TEST 2
jQuery(document).ready(function() {
$("#storeListTable tbody tr").hover(
function() { // mouseover
$(this).addClass('highlight');
},
function() { // mouseout
$(this).removeClass('highlight');
}
);
});
यह मेरा एचटीएमएल कोड
है<html>
<head>
<title>Title</title>
<link rel="stylesheet" href="css/storeLocator.css" type="text/css"
media="screen" charset="utf-8" />
<script type="text/javascript" src="js/jquery.js" charset="utf-8"></
script>
</head>
<body>
<table id="storeListTable">
<thead>
<tr class="even">
<th>ID</th>
<th>Navn</th>
<th>E-post</th>
<th>Nettside</th>
</tr>
</thead>
<tbody>
<tr class="" id="store1">
<td>10</td>
<td>Boss Store Oslo</td>
<td> <a href="mailto:">E-post</a></td>
<td> <a href="#">www</a></td>
</tr>
<tr class="" id="store3">
<td>8</td>
<td>Brandstad Oslo City</td>
<td> <a href="mailto:[email protected]">E-post</a></td>
<td> <a href="#">www</a></td>
</tr>
<tr class="even" id="store4">
<td>7</td>
<td>Fashion Partner AS</td>
<td> <a href="mailto:[email protected]">E-post</a></td>
<td> <a href="#">www</a></td>
</tr>
<tr class="" id="store5">
<td>1</td>
<td>Follestad</td>
<td> <a href="mailto:[email protected]">E-post</a></td>
<td> <a href="#">www</a></td>
</tr>
<tr class="even" id="store6">
<td>2</td>
<td>Follestad</td>
<td> <a href="mailto:[email protected]">E-post</a></td>
<td> <a href="#">www</a></td>
</tr>
</tbody>
</table>
</body>
</html>
तो .... किसी को भी मुझे सही दिशा में एक धक्का दे सकता है?
अद्यतन
मैं jQuery का उपयोग नहीं किसी भी अधिक तालिका पंक्तियों को उजागर करना है, लेकिन सीएसएस।
इस सूची में तत्वों के लिए है, लेकिन मैं इस तालिका पंक्तियों के साथ-साथ के लिए काम करेंगे अनुमान लगा रहा हूँ:
ली: n वें वाले बच्चे (विषम) {पृष्ठभूमि का रंग: # f3f3f3; }
धन्यवाद दोस्त। वह प्लगइन है जिसका उपयोग मैंने समाप्त किया। – Steven
काम करता है लेकिन पुराना है। जूलियन से विधि पृष्ठभूमि रंग विधि का उपयोग करें। नोट - यानी अब लगभग 1.5% (और सिकुड़ रहा है) - और मोबाइल लगभग 7% (और बढ़ रहा है - तो आगे बढ़ने पर ध्यान केंद्रित करने वाला कौन सा आसान है :) –