idまたはclassで要素を選択するjqueryを取得できません。これらの要素にカスタム属性がある場合、要素は属性 "data-bind"を持つtdタグです - knockoutJSを使用しています)jqueryセレクタがdocument.readyでIE8をカスタム属性(knockoutjs)で使用していません
タグで選択すると$("table tr")
、それは正常に動作します。テーブルタグにrunat="server"
を追加してセレクタを$("#<%=tblTimslips.ClientID%>")
に変更しても機能しますが、これを行うとノックアウトでテーブルが認識されなくなります。
編集:別のセレクタ(下のjavascriptの非コメントの1つ)を追加しました.TBODYタグのTRではなく、THEADタグのTRを正常に取得します。
IDまたはクラスで選択しないのはなぜですか?
<style type="text/css">
.highlight2
{
background-color: #0000ee;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
loadClient();
//$(".TimeslipsGrid tr").hover(function() {
// above selector by class doesn't work, nor does the following by id:
// $("#tblTimeslips").hover(function(){
// however, the following selector WILL work on all tr on the page, including my targets in #tblTimeslip:
// $("table tr").hover(function(){
// the following selector works, but ONLY FOR THE TR CONTAINED IN THEAD..
// changing it to "#tblTimeslips tbody tr" doesn't help, either..
$("#tblTimeslips tr").hover(function() {
$(this).addClass("highlight2");
}, function() {
$(this).removeClass("highlight2");
})
</script>
<table id="tblTimeslips" class="TimeslipsGrid">
<thead>
<tr>
<th>Time</th><th>Dur</th><th>File</th><th>Task/Activity</th><th>Note</th>
</tr>
</thead>
<tbody data-bind="foreach: timeslips">
<tr>
<td data-bind="text: TimeString"></td>
<td data-bind="text: DurationString"></td>
<td data-bind="text: FileNumber"></td>
<td data-bind="text: TaskActivityAbbrText"></td>
<td><img data-bind="attr: { src: NoteIconPath }" /></td>
</tr>
</tbody>
</table>
ノックアウトが完了した後の#tblTimeslips htmlの外観は次のとおりです。私はまだ問題を見ることができません。
<table class="TimeslipsGrid" id="tblTimeslips">
<THEAD>
<TR jQuery17108028844206682706="72">
<TH>Time</TH>
<TH>Dur</TH>
<TH>File</TH>
<TH>Task/Activity</TH>
<TH>Note</TH></TR></THEAD>
<TBODY data-bind="foreach: timeslips" __ko__1328033964035="ko1">
<TR jQuery17108028844206682706="73" __ko__1328033964035="ko2">
<TD data-bind="text: TimeString" __ko__1328033964035="ko3">00:00<BR>06:23 AM</TD>
<TD data-bind="text: DurationString" __ko__1328033964035="ko4">6.38</TD>
<TD data-bind="text: FileNumber" __ko__1328033964035="ko5">9-12632-555</TD>
<TD data-bind="text: TaskActivityAbbrText" __ko__1328033964035="ko6">Admin | Agnt Suprvsn</TD>
<TD><IMG src="../Images/Homepage/note_full_16.png" data-bind="attr: { src: NoteIconPath }" __ko__1328033964035="ko7"></TD></TR>
<TR jQuery17108028844206682706="73" __ko__1328033964035="ko8">
<TD data-bind="text: TimeString" __ko__1328033964035="ko9">06:23<BR>06:28 AM</TD>
<TD data-bind="text: DurationString" __ko__1328033964035="ko10">0.08</TD>
<TD data-bind="text: FileNumber" __ko__1328033964035="ko11">9-12601-7</TD>
<TD data-bind="text: TaskActivityAbbrText" __ko__1328033964035="ko12">Admin | PTOW</TD>
<TD><IMG src="../Images/Homepage/note_full_16.png" data-bind="attr: { src: NoteIconPath }" __ko__1328033964035="ko13"></TD></TR>
<TR jQuery17108028844206682706="73" __ko__1328033964035="ko14">
<TD data-bind="text: TimeString" __ko__1328033964035="ko15">06:28<BR>08:28 AM</TD>
<TD data-bind="text: DurationString" __ko__1328033964035="ko16">2</TD>
<TD data-bind="text: FileNumber" __ko__1328033964035="ko17">(no timeslip)</TD>
<TD data-bind="text: TaskActivityAbbrText" __ko__1328033964035="ko18">(none)</TD>
<TD><IMG src="../Images/Homepage/note_empty_16.png" data-bind="attr: { src: NoteIconPath }" __ko__1328033964035="ko19"></TD></TR>
<TR jQuery17108028844206682706="73" __ko__1328033964035="ko20">
<TD data-bind="text: TimeString" __ko__1328033964035="ko21">08:28<BR>09:28 AM</TD>
<TD data-bind="text: DurationString" __ko__1328033964035="ko22">1</TD>
<TD data-bind="text: FileNumber" __ko__1328033964035="ko23">9-12632-553</TD>
<TD data-bind="text: TaskActivityAbbrText" __ko__1328033964035="ko24">T-A | KM</TD>
<TD><IMG src="../Images/Homepage/note_full_16.png" data-bind="attr: { src: NoteIconPath }" __ko__1328033964035="ko25"></TD></TR>
<TR jQuery17108028844206682706="73" __ko__1328033964035="ko26">
<TD data-bind="text: TimeString" __ko__1328033964035="ko27">09:28<BR>11:01 AM</TD>
<TD data-bind="text: DurationString" __ko__1328033964035="ko28">1.55</TD>
<TD data-bind="text: FileNumber" __ko__1328033964035="ko29">(no timeslip)</TD>
<TD data-bind="text: TaskActivityAbbrText" __ko__1328033964035="ko30">(none)</TD>
<TD><IMG src="../Images/Homepage/note_empty_16.png" data-bind="attr: { src: NoteIconPath }" __ko__1328033964035="ko31"></TD></TR>
<TR jQuery17108028844206682706="73" __ko__1328033964035="ko32">
<TD data-bind="text: TimeString" __ko__1328033964035="ko33">11:01<BR>10:00 PM</TD>
<TD data-bind="text: DurationString" __ko__1328033964035="ko34">10.98</TD>
<TD data-bind="text: FileNumber" __ko__1328033964035="ko35">2-9999-1</TD>
<TD data-bind="text: TaskActivityAbbrText" __ko__1328033964035="ko36">ATL | Doc Conv &DE</TD>
<TD><IMG src="../Images/Homepage/note_full_16.png" data-bind="attr: { src: NoteIconPath }" __ko__1328033964035="ko37"></TD></TR></TBODY>
</table>
セレクタがJSとCSSで一致していることを確認してください。 '.timeslipsGrid tr.highlight2'は' .highlight2tr'と同じものではありません。 – Jasper