jQuery - Get Zelle in der Tabelle Wert

Ich habe eine Tabelle die wie folgt aussieht. Der Preis kommt normalerweise aus einer Datenbank dies ist nur zu zeigen, habe ich das problem.

JS:

$(document).ready(function() {
    $(document).delegate('.amount input[type="text"]','keyup',(function() {
        var $this = $(this);
        var sub_total = $this.find('.sub_total');
        var price = $this.find('.price').text();
        var amount = $this.val();
        alert(price);
    }));
});

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tr>
      <td><input type="text" name="tickets" id="tickets" class="amount" maxlength="2" autocomplete="off"></td>
      <td>Ticket:</td>
      <td class="price">20,50</td>
      <td class="sub_total"></td>
  </tr>
</table>

Was ich tun möchte ist: wenn der Benutzer tippt eine Nummer in das Feld tickets es sollte das Feld aktualisieren sub_total. Mit dem jQuery habe ich diese nicht funktioniert. Wenn ich alert(price) bekomme ich undefined. So Frage ich mich, wie die das machen sub_total Feld mit automatisch aktualisierten Werte. Es mag auch interessant sein, zu wissen, dass ich mehr Reihen, wie dies unter dieser Zeile. So sollte das script nur aktualisieren Sie das Feld aus einer bestimmten Zeile zu einem Zeitpunkt.

Was ich bereits versucht, aber ohne Erfolg:
Wie man eine Zelle in der Tabelle Wert mit jQuery;
Wie man eine Zelle in der Tabelle den Wert mithilfe von jQuery?;
Wie man Tabelle Zelle Werte, wo jeder in der Tabelle mit jquery

Vielen Dank im Voraus.

  • Verwenden 'input[type="text"].amount' statt '.amount input[type="text"]' bemerken, Raum entfernt wird
  • Und sollten Sie on() statt delegate().
InformationsquelleAutor SuperDJ | 2014-09-10
  1. 1

    Müssen Sie tun traverse zurück zum übergeordneten element tr, bevor Sie versuchen zu finden .sub_title oder .Preis Elemente.

    $(document).ready(function() {
    $(document).delegate('.amount input[type="text"]','keyup',(function() {
        var $this = $(this);
        var $tr = $this.closest("tr");
        var sub_total = $tr.find('.sub_total');
        var price = $tr.find('.price').text();
        var amount = $this.val();
        alert(price);
    }));
});
    InformationsquelleAutor Keith.Abramo
  2. 1

    Ändern Sie den code wie dieser

    $(document).ready(function() {
    $(document).on('input[type="text"].amount', 'keyup', (function() {
        var $this = $(this);
        var sub_total = $this.closest("tr").find('.sub_total');
        var price = $this.closest("tr").find('.price').text();
        var amount = $this.val();
        alert(price);
    }));
});

    find() suchen für die Kinder. Man sollte also in den übergeordneten tr vor der ersten Benutzung find().

    Können Sie closest("tr") um die übergeordneten tr element

    InformationsquelleAutor Anoop Joshi
  3. 0

    Weil price und sub_total sind nicht die Kinder des aktuellen Elements (als finden Auswahl):

    var sub_total = $this.find('.sub_total');
var price = $this.find('.price').text();

    sind Sie Geschwister, seine Eltern oder einfach mehr Kinder in die container tr.

    Versuchen, statt:

    var sub_total = $this.closest('tr').find('.sub_total');
var price = $this.closest('tr').find('.price').text();
    InformationsquelleAutor Irvin Dominin
  4. -1

    Beispiel für eine 

    <table id="#myTable">

    Ich dies Schreibe:

    function setCell( idTab, row, col, text) {
  var idCel = idTab + " tbody tr:nth-child(" + row + ") td:nth-child(" + col + ")";
  $(idCel).html(text);
}

function getCell( idTab, row, col ) {
  var idCel =idTab + " tbody tr:nth-child(" + row + ") td:nth-child(" + col + ")";
  return $(idCel).html();
}

setCell( "#myTab", 3, 4, "new value" );
alert( getCell("#myTab", 3, 4);
    • Wie Sie sehen können, die Frage ist schon 2 Jahre alt und wurde bereits beantwortet dann. Diese Funktionen sind auch nicht allgemein genug, um das problem zu lösen, die ich hatte.
    InformationsquelleAutor IfThenElse
Schreibe einen Kommentar