web-dev-qa-db-fra.com

Remplacer le texte dans td en utilisant jQuery ayant td contenant d'autres éléments

Mon tableau est comme suit:

<table id='demoTable'>
   <tr>
       <td>8: Tap on APN and Enter <B>www</B>.
           <INPUT id=h150000000000000109743 class=hid value="test value" type=hidden>
           <INPUT id=h250000000000000109743 class=hid1 value="26,222,98,10,50000000000000109744,T,~25,221,99,10,,T,www" type="hidden">
       </td>
   </tr>
</table>

Je veux changer le texte uniquement 8: Tap on APN and Enter <B>www</B>.
sans affecter les champs cachés

J'essaie jQuery mais ne trouve pas la solution

function changeText() {
    $("#demoTable td").each(function () {
        for (var i = 0; i < $(this).children.length; i++) {
            alert($(this).children(i).val());
        }
        // alert($(this).html());
        // $(this).text("hello");
        // alert($(this).html());
    });
}
jqueryhtml
49
शेखर

L'utilisation de nœuds de texte dans jQuery est une tâche particulièrement délicate et la plupart des opérations sont effectuées pour les ignorer complètement.

Plutôt que d'éviter les mauvais nœuds, pourquoi ne pas encapsuler ce que vous devez remplacer dans un <span>, par exemple:

<td><span class="replaceme">8: Tap on APN and Enter <B>www</B>.</span></td>

Ensuite:

$('.replaceme').html('Whatever <b>HTML</b> you want here.');
66
Ja͢ck
$('#demoTable td').contents().each(function() {
    if (this.nodeType === 3) {
        this.textContent
        ? this.textContent = 'The text has been '
        : this.innerText  = 'The text has been '
    } else {
        this.innerHTML = 'changed';
        return false;
    }
})

http://jsfiddle.net/YSAjU/

4
undefined

Supprimez le textnode et remplacez la balise <b> par tout ce dont vous avez besoin sans jamais toucher les entrées

$('#demoTable').find('tr > td').contents().filter(function() {
    return this.nodeType===3;
}).remove().end().end()
  .find('b').replaceWith($('<span />', {text: 'Hello Kitty'}));

FIDDLE

4
adeneo

Un peu tard pour le parti, mais JQuery change le texte intérieur mais conserve le code HTML a au moins une approche non mentionnée ici :

var $td = $("#demoTable td");
$td.html($td.html().replace('Tap on APN and Enter', 'new text'));

Sans corriger le texte, vous pouvez utiliser (snother) [ https://stackoverflow.com/a/37828788/1587329] :

var $a = $('#demoTable td');
var inner = '';
$a.children.html().each(function() {
    inner = inner + this.outerHTML;
});
$a.html('New text' + inner);
0
serv-inc

Que diriez-vous:

function changeText() {
    $("#demoTable td").each(function () {
       $(this).html().replace("8: Tap on APN and Enter <B>www</B>", "");
    }
}
0
webnoob

Emballez votre contenu à supprimer dans un ptag, vous pouvez alors faire quelque chose comme ceci:

$(function(){
  $("td").click(function(){ console.log($("td").find("p"));
    $("td").find("p").remove();    });
});

FIDDLE DEMO: http://jsfiddle.net/y3p2F/

0
Never Back Down