2010-11-20 10 views
52

그래서 문자열과 전달 된 변수 (숫자)에서 문자열을 만들려고합니다. 어떻게하면됩니까?문자열을 변수와 연결하는 방법은 무엇입니까?

나는 이런 식으로 뭔가를 가지고 :

function AddBorder(id){ 
    document.getElementById('horseThumb_'+id).className='hand positionLeft' 
} 

그래서 'horseThumb'하나의 문자열로 ID 것을 얻는 방법?

나는 다양한 종류의 옵션을 시도했다. 나는 이것과 같은 문자열에 변수를 삽입 할 수 있다는 것을 배우기도했다. getElementById("horseThumb_{$id}") < - (나에게 효과가 없었기 때문에 왜 그런지 모르겠다) . 그래서 어떤 도움을 주시면 감사하겠습니다.

+8

당신이 해낸 방식대로. 그러나 당신이 명시 적으로하고 싶다면'id'를'id.toString()'으로 변경할 수 있습니다. –

+4

네, 제대로했습니다. "작동하지 않는"경우 다른 ID가있는 요소가 실제로없는 것처럼 잘못된 것이 있습니다. –

+1

이 코드는'getElementById ("horseThumb _ {$ id}")'는 JavaScript가 아니므로 PHP입니다. 그래서 그것이 당신을 위해 작동하지 않는 이유입니다. – Domenic

답변

38

코드는 올바른 것입니다. 아마도 문제는 사용자가 AddBorder 함수에 ID를 전달하지 않거나 해당 ID를 가진 요소가 존재하지 않는다는 것입니다. 또는 문제의 요소가 브라우저의 DOM을 통해 액세스 가능하기 전에 함수를 실행할 수도 있습니다.

는 첫 번째 경우를 식별하거나 두 번째 경우의 원인을 확인, 함수 내부의 첫 번째 라인으로이를 추가하려면 팝업 창을 함수가 호출 될 때마다 열립니다
alert('ID number: ' + id); 
alert('Return value of gEBI: ' + document.getElementById('horseThumb_' + id)); 

id의 값과 document.getElementById의 반환 값. ID 번호 팝업에 대해 undefined이 표시되면 함수에 인수를 전달하지 않습니다. ID가 없으면 첫 번째 팝업에서 (잘못된?) ID 번호를 얻지 만 초에 null을 얻습니다. 웹 페이지는 다음과 같습니다 경우 페이지가 여전히로드되는 동안

세 번째 경우는 AddBorder를 실행하려고, 일어날 것 :

<head> 
<title>My Web Page</title> 
<script> 
    function AddBorder(id) { 
     ... 
    } 
    AddBorder(42); // Won't work; the page hasn't completely loaded yet! 
</script> 
</head> 

는이 문제를 해결하기 위해, onload 이벤트 안쪽을 AddBorder를 사용하는 모든 코드를 넣어 핸들러는 : 문자열이 숫자와 연결되어있는 경우 자바 스크립트가 가끔 공백을 수 있기 때문에

// Can only have one of these per page 
window.onload = function() { 
    ... 
    AddBorder(42); 
    ... 
} 

// Or can have any number of these on a page 
function doWhatever() { 
    ... 
    AddBorder(42); 
    ... 
} 

if(window.addEventListener) window.addEventListener('load', doWhatever, false); 
else window.attachEvent('onload', doWhatever); 
+0

[mJS]와 같은 일부 임베디드 자바 스크립트 엔진에서는 작동하지 않습니다 ] (https://mongoose-os.com/blog/mjs-a-new-approach-to-embedded-scripting/) -'MJS 콜백 오류 : 암시적인 타입 변환이 금지되어 있습니다 '와 같은 오류가 발생합니다. 명시 적 유형 변환을 사용해야하는 경우 – N0dGrand87

1

마치 네가 한 것처럼. 그리고 이런 어리석은 것들에 대한 작은 팁을 줄 것입니다 : 브라우저 url 상자를 사용하여 js 구문을 시도하십시오. 예를 들어, javascript:alert("test"+5)이라고 쓰면 답을 얻을 수 있습니다. 코드의 문제는 아마도이 요소가 문서에 존재하지 않는다는 것입니다. 아마도 폼이나 뭔가 안에있을 수 있습니다. 당신은 당신의 실수가 어디에 있는지를 확인하기 위해 URL : javascript:alert(document.horseThumb_5)에 글을 써서 이것을 시험 할 수 있습니다.

19

자바 스크립트에서 "+"연산자는 숫자를 추가하거나 문자열을 연결하는 데 사용됩니다. 피연산자 중 하나가 문자열 인 경우 "+"가 연결되고 숫자 일 경우 피연산자가 추가됩니다.

예 :

1+2+3 == 6 
"1"+2+3 == "123" 
+4

재미를 위해서'2 + "3 - 5'의 결과는 무엇입니까? (속임수가 아님) –

+0

@pst NaN입니까? –

+0

@pst Hehe, 좋은 속임수 질문. –

4

이 발생할 수 있습니다. 공백을 제거하고 문자열을 만든 다음 getElementById에 전달하십시오.

예 :

var str = 'horseThumb_'+id; 

str = str.replace(/^\s+|\s+$/g,""); 

function AddBorder(id){ 

    document.getElementById(str).className='hand positionLeft' 

} 
0

또 다른 방법은 jQuery를 사용하여 간단 할 수 있습니다.

샘플 :

PRODUCT_ID는 자바 스크립트 VAR과 $ (PRODUCT_ID + "#이 _ 추가")
function add(product_id){ 

    // the code to add the product 
    //updating the div, here I just change the text inside the div. 
    //You can do anything with jquery, like change style, border etc. 
    $("#added_"+product_id).html('the product was added to list'); 

} 

가 PRODUCT_ID와 연결 사업부의 ID, 기능 추가에서 VAR입니다.

최고 감사합니다.

관련 문제