2010-11-20 26 views
52

Así que estoy tratando de hacer una cadena de una cadena y una variable pasada (que es un número). ¿Cómo hago eso?¿Cómo concateno una cadena con una variable?

tengo algo como esto:

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

Entonces, ¿cómo hago para que 'horseThumb' y un id en una cadena?

Probé todas las opciones, también busqué en Google y además de aprender que puedo insertar una variable en una cadena como esta getElementById("horseThumb_{$id}") < - (no funcionó para mí, no sé por qué) No he encontrado nada útil . Entonces cualquier ayuda sería muy apreciada.

+8

De la manera en que lo ha hecho. Pero si quieres ser explícito, puedes cambiar 'id' por' id.toString() '. –

+4

Sí, lo has hecho correctamente. Si "no funciona", entonces algo más está mal, como si realmente no hubiera un elemento con esa ID. –

+1

Este código: 'getElementById (" horseThumb _ {$ id} ")' no es JavaScript, es PHP. Entonces es por eso que no funcionó para ti. – Domenic

Respuesta

38

Su código es correcto. Tal vez su problema es que no está pasando una identificación a la función AddBorder, o que un elemento con esa ID no existe. O podría estar ejecutando su función antes de que el elemento en cuestión sea accesible a través del DOM del navegador.

para identificar el primer caso o determinar la causa del segundo caso, agregar estos como las primeras líneas dentro de la función:

alert('ID number: ' + id); 
alert('Return value of gEBI: ' + document.getElementById('horseThumb_' + id)); 

que abrirá las ventanas emergentes cada vez que la función se llama, con el valor de id y el valor de retorno de document.getElementById. Si obtiene undefined para la ventana emergente de número ID, no está pasando un argumento a la función. Si la identificación no existe, obtendría su número de identificación (¿incorrecto?) En la primera ventana emergente, pero obtenga null en la segunda.

El tercer caso pasaría si su página web se ve como este, tratando de correr AddBorder mientras que la página todavía se está cargando:

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

Para solucionar este problema, poner todo el código que utiliza AddBorder dentro de un evento onload manejador:

// 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

No funcionará para algunos motores JavaScript incrustados, como [mJS ] (https://mongoose-os.com/blog/mjs-a-new-approach-to-embedded-scripting/) - dará lugar al error como 'error de devolución de llamada MJS: la conversión de tipo implícita está prohibida'. Para ese caso, se requiere el uso de conversión de tipo explícita – N0dGrand87

1

Es como tú. Y les daré un pequeño consejo para este tipo de cosas tontas: simplemente use el cuadro de la url del navegador para probar la sintaxis de js. por ejemplo, escriba esto: javascript:alert("test"+5) y tiene su respuesta. Es probable que el problema en su código sea que este elemento no existe en su documento ... quizás esté dentro de un formulario o algo así. Puede probar esto también escribiendo en la url: javascript:alert(document.horseThumb_5) para verificar dónde está su error.

19

En javascript, el operador "+" se usa para agregar números o para concatenar cadenas. si uno de los operandos es una cadena "+" concatena, y si solo son números, los agrega.

ejemplo:

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

Y solo por diversión, ¿cuál es el resultado de: '2 +" 3 "- 5'? (sin trampas) –

+0

@pst ¿Es NaN? –

+0

@pst Hehe, buen truco-pregunta. –

4

Esto puede suceder porque la escritura de java permite que los espacios en blanco a veces si una cadena se concatena con un número. intente eliminar los espacios y crear una cadena y luego pasarlo a getElementById.

ejemplo:

var str = 'horseThumb_'+id; 

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

function AddBorder(id){ 

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

} 
0

otra manera de hacer que sea más fácil el uso de jQuery.

muestra:

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'); 

} 

Dónde product_id es la var javascript y $ ("# añadió _" + product_id) es un identificador div concatenado con product_id, el var de la función add.

¡Atentamente!

Cuestiones relacionadas