añadir una cadena a una variable en jquery añade varias veces

cuando guardo el valor de algo en una variable y luego añadir una cadena a ella para que pueda reemplazarla agrega la cadena tres veces. No puedo averiguar cómo arreglar esto. Aquí está el código.

var value = $("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text').html();
var newValue = value + '
 Expected delivery';
$("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text').html(newValue);

También he probado abajo y también lo añade tres veces

$("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text').append('
 Expected Delivery');

aquí está el html snippet


  
    
       

          First USPS

aquí es lo que parece después de que el código de jquery se añade

Pregunta hecha hace 3 años, 4 meses, 29 días - Por debugduke

2 Respuestas:

  • El problema que estás experimentando es que cada vez que ejecutas el código jQuery, estás agregando la cadena adicional a la variable existente en lugar de reemplazarla. Por lo tanto, se está acumulando la cadena adicional cada vez que se ejecuta el código.

    Para solucionar esto, debes asegurarte de que estás reemplazando el contenido existente en lugar de simplemente agregar la cadena adicional. Puedes hacer esto utilizando el método html() si deseas reemplazar el contenido HTML completo o el método text() si solo deseas reemplazar el texto de la etiqueta.

    Aquí tienes una forma de corregir tu código utilizando el método html() para reemplazar el contenido completo de la etiqueta <span> con la nueva cadena:

    javascript
var value = $("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text');
value.html('First USPS - $2.99 
     Expected delivery');

    Con este cambio, ahora el contenido de la etiqueta <span> se reemplazará en lugar de simplemente agregar la cadena adicional cada vez que se ejecute el código jQuery.

    Respondida el Dec 17, 2020 a las 12:45 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • El problema es que estás usando html() para establecer el valor del elemento <span class="ui-button-text">. Este método reemplaza el contenido actual del elemento con el nuevo contenido. Como resultado, cuando se agrega la cadena por segunda y tercera vez, se agrega al final del contenido existente, lo que provoca la duplicación.

    Para resolver este problema, debes utilizar el método append() en lugar de html(). append() agrega el nuevo contenido al final del contenido existente, por lo que no sobrescribirá el contenido existente.

    Aquí tienes el código corregido:

    javascript
var value = $("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text').html();
var newValue = value + '
     Expected delivery';
$("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text').append(newValue);

    También puedes usar el método text() para establecer el valor del elemento <span class="ui-button-text">. text() reemplaza el contenido de texto del elemento, dejando intactas las etiquetas HTML.

    Aquí tienes el código corregido usando text():

    javascript
var value = $("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text').text();
var newValue = value + '\nExpected delivery';
$("input[value='First USPS ___Mis.EasyPost']").parents('.shipping-option-item').find('.ui-button-text').text(newValue);

    Espero que esto resuelva tu problema.

    Respondida el Dec 17, 2020 a las 12:47 - por Gemini

    Votos positivos: 0 | Votos negativos: 0