Wie wird ein Inkrement (1) zum Wert eines Elements mit JQuery hinzugefügt

Question

Wie erhöht man $ Zeile [Fehlbetrag] auf $ Zeile [Fehlbetrag] +1 mit JQuery?

Answer 1

Sie benötigen parseInt, um Strings als Zahlen zu behandeln.

$("#shortfall").text(parseInt($("#shortfall").text()) + 1); 

Answer 2

Wenn es zum Browser kommt, wird Ihr Ausdruck ausgewertet und in eine Zahl umgewandelt. Um jQuery zu verwenden, würden Sie einfach den Textwert des Bereichs abrufen, ihn in eine Zahl umwandeln und dann den Textwert ersetzen. Sie müssen den Wert in eine Zahl konvertieren, bevor Sie die Addition durchführen, oder es wird eine String-Verkettung durchgeführt.

$("#shortfall").each(function() { 
    $(this).text(Number($(this).text()) + 1); 
}); 

Aktualisiert: Ich bin jede Verwendung zu zeigen, wie Sie dies tun würden, eine generische Selektor, der eine Sammlung von Eingaben akzeptieren könnte. In Ihrem Fall, wenn Sie wissen, dass es genau einem Element entspricht, können Sie es optimieren, mit dem Risiko, es neu schreiben zu müssen, wenn Sie möchten, dass der Code auf mehrere Elemente angewendet wird. Bedarfstext() verwenden (oder HTML()), da das Element ein SPAN ist, keine Eingabe:

var span = $("#shortfall"); 
span.text(Number(span.text()) + 1); 

aktualisiert.

Answer 3

$(document).ready(function(){ 
 
    $("#increment").click(function(){ 
 
    $(".sl-no").html(function(){ 
 
     $(this).html(parseInt($(this).html())+1); 
 
    }); 
 
    }); 
 
});

table { 
 
    font-family: arial, sans-serif; 
 
    border-collapse: collapse; 
 
    width: 100%; 
 
} 
 

 
td, th { 
 
    border: 1px solid #dddddd; 
 
    text-align: left; 
 
    padding: 8px; 
 
} 
 

 
tr:nth-child(even) { 
 
    background-color: #dddddd; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <button id='increment'>Click to Increment</button> 
 
<table> 
 
    <tr> 
 
    <th>Sl</th> 
 
    <th>Company</th> 
 
    <th>Contact</th> 
 
    <th>Country</th> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>1</td> 
 
    <td>Alfreds Futterkiste</td> 
 
    <td>Maria Anders</td> 
 
    <td>Germany</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>2</td> 
 
    <td>Centro comercial Moctezuma</td> 
 
    <td>Francisco Chang</td> 
 
    <td>Mexico</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>3</td> 
 
    <td>Ernst Handel</td> 
 
    <td>Roland Mendel</td> 
 
    <td>Austria</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>4</td> 
 
    <td>Island Trading</td> 
 
    <td>Helen Bennett</td> 
 
    <td>UK</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>5</td> 
 
    <td>Laughing Bacchus Winecellars</td> 
 
    <td>Yoshi Tannamuri</td> 
 
    <td>Canada</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>6</td> 
 
    <td>Magazzini Alimentari Riuniti</td> 
 
    <td>Giovanni Rovelli</td> 
 
    <td>Italy</td> 
 
    </tr> 
 
</table>