2011-07-06 6 views
1

replace()은 IE7에서는 작동하지 않지만 IE8에서는 작동합니다. 내가 켜고 끄는 제품들..replace()가 IE7에서 작동하지 않습니다.

.replace()를 제거하면 IE7에서 작동합니다.

스크립트

$('li.prod').toggle(true); 

$('li.prod:visible').each(function(i){ 

    i && ((i+1)%4 || $(this).addClass('prod-end')); 

}); 

$('li.button').click(function(){ 

    $('li.button').removeClass('active'); 

    $(this).addClass('active'); 

$('li.prod').removeClass('prod-end'); 

if ($('li#all').hasClass('active')) { 

    $('li.prod').toggle(true); 

    $('li.prod:visible').each(function(i){ 

      i && ((i+1)%4 || $(this).addClass('prod-end')); 

     }); 

} else { 

    $('li.prod').toggle(false); 

    $('li.' + $(this).text().replace(/ /g, "-")).toggle(true); 

     $('li.' + ($(this).text().replace(/ /g, "-")) + ':visible').each(function(i){ 

      i && ((i+1)%4 || $(this).addClass('prod-end')); 

     }); 

} 

}); 

HTML

<div class="subNav"> 
<ul> 
<li class="button active" id="all">all</li> 
<li class="button" id="swimming">swimming</li> 
<li class="button" id="lawn">lawn games</li> 
</ul> 
</div> 
<ul> 
<li class="prod swimming"></li> 
<li class="prod swimming"></li> 
<li class="prod lawn-games"></li> 
<li class="prod lawn-games"></li> 
<li class="prod lawn-games"></li> 
</ul> 
+0

"One Two Three".replace (//g, '-')'는 나를 위해 IE7에서'One-Two-Three'를 만듭니다. 더 많은 정보가 필요합니다. – Robert

+2

$ (this) .text()가 무엇을 반환합니까? – ShankarSangoli

+0

무엇이 반환되는지 확인할 수 있습니까? – Buildingbrick

답변

0

이 문제를 해결하기위한 더 좋은 방법이 있습니다. 방금 흰 공백을 대체하기보다는 텍스트의 첫 글자를 사용했습니다. 더 간단한 솔루션.

도움 주셔서 감사합니다.

0

음, 그건 이상하다. 당신이 시도 할 수 :

$('li.' + $(this).text().replace(/\s/g, "-")).toggle(true); 

를 문제가 해결되지 않으면 문제가 .replace() 관련,하지만 this 요소되지 않습니다.

희망이 도움이됩니다. 건배

+0

당신이 제안한 바꿔 놓은 행운을 시험해 보았습니다. .replace()를 제거하면 작동합니다. – Buildingbrick

0

이것은 IE8에서 방금 시도한 테스트 페이지입니다. 그것은 잘 작동합니다. FF5에서도 잘 작동합니다.

이 내용을 복사하여 테스트 해주십시오.

전체를 직접 복사하여 붙여 넣기 할 수 있습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script type="text/javascript"> 
     $(function() { 
      $('li.prod').toggle(true); 

      $('li.prod:visible').each(function (i) { 
       i && ((i + 1) % 4 || $(this).addClass('prod-end')); 
      }); 

      $('li.button').click(function() { 
       $('li.button').removeClass('active'); 
       $(this).addClass('active'); 
       $('li.prod').removeClass('prod-end'); 

       if ($('li#all').hasClass('active')) { 
        $('li.prod').toggle(true); 
        $('li.prod:visible').each(function (i) { 
         i && ((i + 1) % 4 || $(this).addClass('prod-end')); 
        }); 
       } 
       else { 
        $('li.prod').toggle(false); 
        $('li.' + $(this).text().replace(/ /g, "-")).toggle(true); 
        $('li.' + ($(this).text().replace(/ /g, "-")) + ':visible').each(function (i) { 
         i && ((i + 1) % 4 || $(this).addClass('prod-end')); 
        }); 
       } 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <div class="subNav"> 
     <ul> 
      <li class="button active" id="all">all</li> 
      <li class="button" id="swimming">swimming</li> 
      <li class="button" id="inflatables">inflatables</li> 
     </ul> 
    </div> 
    <ul> 
     <li class="prod swimming">swim1</li> 
     <li class="prod swimming">swim2</li> 
     <li class="prod inflatables">inf1</li> 
     <li class="prod inflatables">inf2</li> 
     <li class="prod inflatables">inf3</li> 
    </ul> 
</body> 
</html> 
+0

나는 그것이 작동한다고 말했을 때, 나는 모든 것을 모두 클릭하는 것을 의미했다. 수영을 클릭하면 swim1, swim2하지만 inf *를 숨기고 inflatables를 클릭하면 inf1, inf2 및 inf3이 표시되지만 swim1, swim2는 숨김 – kheya

+0

예, 작동하지만 링크 중 하나의 공간에서 사용해보십시오. subnav에서 "inflatables"를 "lawn games"로 변경하십시오. inflatables 클래스를 "잔디 게임"으로 변경하십시오. .replace가 사용되는 전체 이유이기 때문에 이것을 반영하기 위해 예제를 업데이트했습니다. – Buildingbrick

+0

http://stackoverflow.com/questions/360491/how-do-i-strip-white-space-when-grabbing-text-with-jquery IE의 공백을 제거하기 위해 이것을 참조하는 "/ [\ s \ xA0 ] +/g " – Buildingbrick

관련 문제