проблема jQuery в IE - PullRequest
       0

проблема jQuery в IE

1 голос
/ 04 июля 2011

Мой простой скрипт jQuery не работает в IE.

Пожалуйста, помогите.

весь код HTML здесь:

<script type="text/javascript" src="jquery-1.4.2.min.js" ></script>
<script type="text/javascript">
$(document).ready(function() {
        var cvalue = $(".space").css("backgroundColor");
        $(".space").css("color",cvalue);    
   });
</script>

<style>
table.tdata td {
    padding: 10px;
}
tr.zrow1 {
    background-color: #ccc
}
tr.zrow2 {
    background-color: #aaa
}
tr.zrow1 td, tr.zrow2 td {
    border-top: 1px solid white;
    border-left: 1px solid #ccc;
}
table.tdata tr.thead1 {
    text-align: center;
}

table.tdata tr.thead {
    background-color: #003;
    color: white;
    text-align: center;
}
.thrColFixHdr #header h1 {
    margin: 0; 
    padding: 10px 0; 
}
.thrColFixHdr #mainContent {
    margin: 0 200px; 
    padding: 0 10px; 
}
</style>

<div id="areaRec">
<h2 style="margin-top: 0pt;">Sample text</h2>
<p>Sample text  Sample text Sample text Sample text Sample text Sample text Sample text Sample text<span class="space">_</span>text Sample text Sample text Sample text Sample text<br />text Sample text Sample text Sample text Sample text text Sample text Sample text Sample text Sample text text Sample text Sample text Sample text Sample text text Sample text Sample text Sample text Sample text text Sample text Sample text Sample text Sample text</p>
<h3 style="margin-top: 0pt;">text Sample text Sample text </h3>
<p>Sample textSample textSample textSample textSample textSample text<span class="space">_</span>Sample textSample textSample textSample textSample text<span class="space">_</span>Sample textSample textSample text  textSample textSample textSample textSample textSample textSample textSample textSample textSample textSample textSample textSample textSample textSample text.</p>
<h3 style="margin-top: 0pt;">Sample textSample textSample textSample text</h3>
<div class="show_job">
<table class="job-position" border="0" cellspacing="1" cellpadding="4">
<tbody>
<tr class="zrow2">
<td class="title-col" width="181" valign="top">Sample text</td>
<td width="457" valign="top">
<ul>
<li>text Sample text Sample text Sample text Sample text<span class="space">_</span>Sample text</li>
<li>text Sample text Sample text Sample text Sample text<span class="space">_</span>Sample text</li>
<li>text Sample text Sample text Sample text Sample text<span class="space">_</span>Sample text Sample text<span class="space">_</span>Sample text:</li>
</ul>
<blockquote><ol>
<li>Adobe Photoshop</li>
<li>Adobe InDesign</li>
<li>Adobe Illustrator</li>
</ol><ol> </ol></blockquote>
<blockquote><ol> </ol></blockquote>
</td>
</tr>
<tr class="zrow1">
<td class="title-col" width="181" valign="top">Sample text</td>
<td width="457" valign="top">Sample text</td>
</tr>
<tr class="zrow2">
<td class="title-col" width="181" valign="top">Sample text</td>
<td width="457" valign="top">Sample text</td>
</tr>
<tr class="zrow1">
<td class="title-col" width="181" valign="top">Sample text</td>
<td width="457" valign="top">Sample text</td>
</tr>
<tr class="zrow2">
<td class="title-col" width="181" valign="top">Sample text </td>
<td width="457" valign="top">Sample text</td>
</tr>
<tr class="zrow1">
<td class="title-col" width="181" valign="top">Sample text </td>
<td width="457" valign="top">Sample text<span class="space">_</span>Sample textSample textSample textSample text<span class="space">_</span>Sample textSample textSample textSample textSample text </td>
</tr>
</tbody>
</table>
</div>
</div>

Я думаю, что IE не понимает прозрачного значения в CSS, какое-либо решение?

Окончательное решение:

$('.space').each(function(index, value){
var cvalue = $(".space").css("backgroundColor");
if(cvalue == '' || cvalue == 'transparent'){
 var pcolor = ($(this).closest('div, p, tr').css('backgroundColor'));
 if (pcolor == '' || pcolor == 'transparent'){
  //this means the closet tag hasnt any bgcolor and it is white 
      $(this).css('color','white');
 }else {
  $(this).css('color',pcolor);
 }
}else{
 $(this).css('color',cvalue);
}
});

Ответы [ 2 ]

4 голосов
/ 04 июля 2011

Вам не хватает точки с запятой в конце кода Добавьте это, и все должно быть в порядке - http://jsbin.com/anuric/2/

$(document).ready(function() { var cvalue = $(".space").css("background-color"); alert(cvalue); $(".space").css("color",cvalue); });

update;

<script type="text/javascript">
    $(document).ready(function() {
        var cvalue = $(".space").css("background-color");
        alert(cvalue);
        $(".space").css("color",cvalue);    
    });
</script>

Обновите, используя ваш HTML; http://jsbin.com/asigah/

Update2 - Убедитесь, что у вас есть значение CSS для .space background-color в вашем CSS, cvalue не может найти фонцвет для .space, если он не существует.

.space { background-color: #fff; }

Обновление 3 - если вы просто хотите «спрятать» содержимое .space и просто оставить там пустое место, тогдаиспользуйте это;

$(document).ready(function() {
    $('.space').replaceWith('&nbsp;'); 
});

Рабочий образец здесь;http://jsbin.com/asigah/3

Обновление 4;

$(document).ready(function() {
  $('.space').each(function(index, value){
    var cvalue = ($(this).closest('div, p, tr').css('background-color'));
    //alert(cvalue);
    $(this).css('color',cvalue);
  });
});

Это позволит найти теги ближайшего элемента (div, p или tr) и установить для цвета .space значениебыть таким же, как цвет фона элемента, который он находит.Я думаю, что это то, что вы хотите.

Предварительный просмотр здесь - http://jsbin.com/asigah/28

0 голосов
/ 04 июля 2011

Этот код будет работать, если вы добавите цвет фона к .space , используя css

$(document).ready(function() {
     var cvalue = $(".space").css("backgroundColor");
     $(".space").css("color",cvalue);    
});

Примечание:

Код работает. но он добавил transparent цвет к .space, потому что .space не имеет фона, определенного в css. Поэтому вам нужно добавить backgound цвет к .space.

Этот код предназначен для вашей текущей структуры HTML и CSS без изменений:

$(document).ready(function() {
    $('.space').each(function(index, value){
      var cvalue = $(this).parents().find('tr').css('backgroundColor');
      $(this).css('color', cvalue);
    });
});

Я добавил еще один фрагмент кода:

$(document).ready(function() {
    $('.space').each(function(index, value) {
        var that = this;
        $(this).parents().each(function() {
            var cvalue = $(this).css('backgroundColor');
            if (cvalue != '' && cvalue != 'transparent') {
                $(that).css('color', cvalue);
            }
        });
    });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...