¿Cómo codificar la siguiente URL utilizando JavaScript o jQuery correctamente?

Question

Todo lo que queremos hacer es codificar el siguiente enlace correctamente, pero por alguna razón "#" me está dando un problema:

var text = "hello, how are you? &am fine" 
var link = "http://example.com/test#zzzzzzzzz" 


url = "http://twitter.com/share?url=" + link + "&text" + text; 
$("#twitter a").attr("href", url) 

Probé encodeURI o encodeURIComponent, pero todavía tienen problema con "#". Si reemplazo manualmente "#" con "% 23", entonces, por alguna razón, el código se codifica de nuevo. ¿El jQuery attr() preforma cualquier codificación?

EDITAR Tratando de escape produce

http://twitter.com/share?url=http%253A//example.com/test%2523zzzzzzzz 

No está seguro de que el "25%" está viniendo en lugar de sólo el 23%

Usando encodeURIComponent genera el siguiente después de hacer $("#twitter a").attr("href", url). ¿De dónde viene el% 25?

http://twitter.com/share?url=http%253A%252F%252Fexample.com%252Ftest%2523zzzzzzzz 

Answer 1

encodeURIComponentdebe trabajar para usted:

var text = "hello, how are you? & fine"; 
var link = "http://example.com/test#zzzzzzzzz"; 

var url = "http://twitter.com/share?url=" + encodeURIComponent(link) + "&text=" + encodeURIComponent(text); 

$('#twitter a').attr('href', url); 

jsFiddle example

Answer 2

De acuerdo con Firebug:

>>> encodeURIComponent("http://example.com/test#zzzzzzzzz") 
"http%3A%2F%2Fexample.com%2Ftest%23zzzzzzzzz" 

¿Qué temas le tienen con el '#'?

Answer 3

encodeURIComponent no es "completa", puede utilizar una función personalizada como esto (tomado de http://phpjs.org/functions/urlencode/):

function encode(toEncode) { 
    return encodeURIComponent(toEncode) 
     .replace(/!/g, '%21') 
     .replace(/'/g, '%27') 
     .replace(/\(/g, '%28') 
     .replace(/\)/g, '%29') 
     .replace(/\*/g, '%2A'); 
} 

Ejemplo: var url = codificar (url_plain_text);

Answer 4

encodeURIComponent funciona bien para mí. podemos dar la url como esta en código ajax call.The muestra a continuación:

$.ajax({ 
      cache: false, 
      type: "POST", 
      url: "http://atandra.mivamerchantdev.com//mm5/json.mvc?Store_Code=ATA&Function=Module&Module_Code=thub_connector&Module_Function=THUB_Request", 
      data: "strChannelName=" + $('#txtupdstorename').val() + "&ServiceUrl=" + encodeURIComponent($('#txtupdserviceurl').val()), 
      dataType: "HTML", 
      success: function (data) { 
      }, 
      error: function (xhr, ajaxOptions, thrownError) { 
      } 
     });