jQuery [object Object] 문제

Question

jQuery를 사용하여 CSS 속성을 업데이트하려고하지만 작동하지 않습니다. 내 첫 번째 경고 아래의 코드에 경고를 사용하여

url("file:///H:/Web/example/HTML/images/red-arrow-up.png") 

하지만합니다 (if 문에서) 두 번째 경고가 나타납니다

[object Object] 

을 제공하지만 내가 그것을 할 원하는 속성 업데이트입니다 url에서 아래로 변경하십시오. 뭐가 잘못 됐는지 어떤 생각이야?

$(document).ready(function() { 
     $(".portlet-header").click(function() { 
      var currValue = $(this).children(".portlet-arrow").css("background-image"); 
      alert (currValue) 
      if ($("currValue:contains('up')")) { 
       var newValue = $(currValue.replace("up", "down")); 
       alert(newValue) 
       $(this).children(".portlet-arrow").css("background-image", newValue)  
      }; 
      if ($("currValue:contains('down')")) { 
       var newValue = $(currValue.replace("down", "up")); 
       alert(newValue) 
       $(this).children(".portlet-arrow").css("background-image", newValue)  
      }; 
     }); 
    }); 

Answer 1

이 기본적으로 모든 선택기가 실제로 무엇을 찾기 위해 설명서를 참조하지 않고 아래로 오버 - 더 - 상단의 jQuery 선택 구문 진행에 온다.

왜 $()에서 currValue.replace("down", "up")을 둘러싸고 않았다

1. ? 이는 이미지 URL을 포함하는 문자열에서 jQuery 객체를 생성하려는 시도처럼 보입니다. 그러지 마. 아무 이유없이 임의의 자바 스크립트 코드는 $()에 포함되지 않습니다.

2. 또한 $("currValue:contains('down')")은 사용자 의견을 반영하지 않습니다. 이 구문은 문자열에 임의의 조건문을 구현하지 않고 특정 기준에 따라 DOM 노드를 선택하기위한 구문입니다. You just want to search within a string.

$(document).ready(function() { 
    $(".portlet-header").click(function() { 
     var currValue = $(this).children(".portlet-arrow").css("background-image"); 
     alert(currValue); 
     if (currValue.indexOf('up') != -1) { 
      var newValue = currValue.replace("up", "down"); 
      alert(newValue); 
      $(this).children(".portlet-arrow").css("background-image", newValue); 
     } 
     if (currValue.indexOf('down') != -1) { 
      var newValue = currValue.replace("down", "up"); 
      alert(newValue); 
      $(this).children(".portlet-arrow").css("background-image", newValue); 
     } 
    }); 
}); 

코드는 더욱 향상시킬 수 있습니다

$(function() { 
    $(".portlet-header").click(function() { 

     var currValue = $(this).children(".portlet-arrow").css("background-image"); 
     alert(currValue); 

     if (currValue.indexOf('up') != -1) { 
      var newValue = currValue.replace("up", "down"); 
     } 
     else if (currValue.indexOf('down') != -1) { 
      var newValue = currValue.replace("down", "up"); 
     } 
     else { 
      return; 
     } 

     alert(newValue); 
     $(this).children(".portlet-arrow").css("background-image", newValue); 
    }); 
}); 

Answer 2

경고가 당신에게 보여줍니다 [개체 개체] 당신은에 의해 문자열에서의 jQuery 객체를 생성하기 때문에 :

$(currValue.replace("up", "down")); 

currValue.re를 사용해야합니다. 장소 ("위", "아래"); $()없이.

또한

if ($("currValue:contains('up')")) { 

이 올바르지 않습니다. 이것은 당신이 $()에 전달한 문자열로부터 빈 jQuery 객체를 생성하기 때문에 항상 true를 반환합니다.

당신은 사용해야합니다 : 문자열이 일부 문자열을 포함하는 경우

currValue.indexOf('up') !== -1 

또는

/up/.test(currValue) 

테스트 할 수 있습니다.