6

Tengo el siguiente componente html al cual le paso un Json:

<a href="javascript:abreModal('{ 'name':'John', 'age':'30', 'city':'New York'}');">
     Pulsador
</a>

Y la función Javascript:

function abreModal(text) {
        //var text = '{ "name":"John", "age":"function () {return 30;}", "city":"New York"}';
        obj = JSON.parse(text);
        alert(obj.name);
}

El error que me lanza firebug es:

SyntaxError: missing ) after argument list

Sospecho que el error esta en las comillas del abreModal(...) he probado a cambiar las comillas sin resultado.

¿Alguna sugerencia?

4 respuestas 4

8
abreModal('{ 'name':'John', 'age':'30', 'city':'New York'}');
          ^  ^

Tu cadena está entre las dos marcas que te puse, y lo siguiente que escribes es name en lugar de una coma (,) o el cierre del paréntesis. Lo que te recomiendo es que no mandes un Json sino el objeto:

<a href="javascript:abreModal({ 'name':'John', 'age':'30', 'city':'New York'});">
    Pulsador
</a>

Y así no es necesario parsear ni nada:

function abreModal(obj) {
    alert(obj.name);
}

Recuerda que Json sirve para intercambiar datos entre servidor y cliente, no tiene mucho sentido que transformes un objeto en Json y después lo parsees en el mismo script.

Ahora bien, si la situación es que recibes ese Json desde otro lado, entonces te recomiendo que lo parsees antes de mandarlo y mandes la variable que lo contenga.

4

Simplemente remueve las comillas y pasa el objeto como tal, así puedes acceder directamente a el en la función, es decir:

Tu tienes esto:

javascript:abreModal('{ 'name':'John', 'age':'30', 'city':'New York'}');
                     ^                                               ^ 

Simplemente remueve las comillas que encierran el objeto

javascript:abreModal( { 'name':'John', 'age':'30', 'city':'New York'} );
                     ^                                               ^

Y ya no necesitas parsear nada pues tendrás un objeto literal con el cual trabajar y acceder a sus propiedades

function abreModal(obj) {
  console.log('Name: ' + obj.name + ', Age: ' + obj.age + ', City: ' + obj.city)
  alert('Name: ' + obj.name + ', Age: ' + obj.age + ', City: ' + obj.city);
}
<a href="javascript:abreModal({ 'name':'John', 'age':'30', 'city':'New York'});">
     Pulsador
</a>

3

Si realmente necesitas pasar una cadena JSON por parámetro, entonces:

Podrías imprimir el JSON encodeado para URI, de esta forma las comillas simples ('), dobles (") y cualquier otro carácter especial quedarían escapados, evitando de esta forma que el HTML se rompa.

En JS puedes usar encodeURIComponent

Ejemplo:

function abreModal(text) {
  obj = JSON.parse(text);
  alert(obj.name);
}
<a href="javascript:abreModal('%7B%22name%22%3A%22John%22%2C%22age%22%3A30%2C%22city%22%3A%22New%20York%22%7D');">
     Pulsador
</a>

1
  • Aunque es una respuesta válida, ¿no crees que sea poco legible?
    – Jorius
    el 8 mar. 2017 a las 16:06
0

Una buena practica es usar onclicky tenias comillas simples por demas, el JSON que envias no hace falta parsear.

function abreModal(text) {
        
        console.log(text.name);
}
<a href="#" onclick="abreModal({'name':'John', 'age':'30'})">
     Pulsador
</a>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.