Bei der Auswahl verschiedener Optionen kann der Eingabefeldtyp eine 20-stellige Rupie mit Rupiensymbol unterstützen oder durch einen Prozentsatz ersetzt werden
P粉022140576
2023-08-13 18:35:32
<p>Wenn die Option zur Auswahl eines festen Werts ausgewählt ist, lautet der Eingabefeldtyp „Rupie“. Der Wert unterstützt nur 20 Ziffern mit dem Rupiensymbol. Wenn „Prozent“ ausgewählt ist, wird das Rupiensymbol durch das Prozentsymbol ersetzt und der Werttyp besteht nur aus zwei Ziffern. Sie können den Wert eingeben, ohne auf die Schaltfläche </p> klicken zu müssen.
<p>Mein Code funktioniert gut, aber ich habe zwei kleine Probleme
1. Wenn meine Webseite den Standardwert lädt, der auf einen festen Wert gesetzt ist (aber Eingabewert und Rupiensymbol funktionieren nicht</p><p>
2. Wenn Sie den Wert ändern, funktionieren beide, der Wert wird jedoch nicht automatisch auf den geänderten Zustand zurückgesetzt. Der Prozentwert wird nicht mehr geändert, wenn der Benutzer einen einzelnen Prozentsatz auswählt. Bitte überprüfen Sie einen beliebigen Teil meines Codes
Dies ist ein ähnlicher Code</p>
<pre class="brush:php;toolbar:false;"><!DOCTYPE html>
<html>
<Kopf>
<title>Eingabefeld</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$('#dropdown').change(function() {
var selectedOption = $(this).val();
if (selectedOption === 'fixed') {
$('#inputField').attr('maxlength', '20');
$('#inputField').on('input', function() {
var value = $(this).val();
var formattedValue = '£' + value.replace(/D/g, '').replace(/(d)(?=(d{3})+(?!d))/g, '$1,') ;
$(this).val(formattedValue);
});
} else if (selectedOption === 'percentage') {
$('#inputField').attr('maxlength', '2');
$('#inputField').on('input', function() {
var value = $(this).val();
var formattedValue = value.replace(/D/g, '') + '%';
$(this).val(formattedValue);
});
}
});
});
</script>
</head>
<Körper>
<select id="dropdown">
<option value="fixed">Fester Wert</option>
<option value="percentage">Prozentsatz</option>
</select>
<input type="text" id="inputField">
</body>
</html></pre>
<p><br /></p>
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
让我们简化事情，创建一个单独的函数，并基于该函数在文本字段上应用您的逻辑。
示例：
$('#dropdown').change(function() { var selectedOption = $(this).val(); check(selectedOption); }); $('#inputField').on('input', function() { var selectedOption = $('#dropdown :selected').val(); check(selectedOption); }); function check(inp) { var value = $('#inputField').val(); if (inp === 'fixed') { $('#inputField').attr('maxlength', '20'); var formattedValue = '₹' + value.replace(/\D/g, '').replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,'); $('#inputField').val(formattedValue); } else { $('#inputField').attr('maxlength', '2'); var formattedValue = value.replace(/\D/g, '') + '%'; $('#inputField').val(formattedValue); } }