انـجـمـن سیمرغ
1402-06-09 16:06 تبدیل رشته به عدد جاوا اسکریپت در HTML: به دنبال شفاف سازی
xavier12

 
من روی یک پروژه کوچک HTML و جاوا اسکریپت کار می کنم و با یک مشکل در تبدیل رشته ها به اعداد روبرو هستم. من یک فیلد ورودی در HTML خود دارم که در آن کاربران می توانند یک عدد را به عنوان رشته وارد کنند. من از جاوا اسکریپت برای تبدیل این رشته به عدد و انجام محاسبات استفاده می کنم، اما نتایج مورد انتظار را دریافت نمی کنم.

کد HTML و جاوا اسکریپت من در اینجا آمده است

<!DOCTYPE html>
<html>
<head>
    <title>String to Number Conversion</title>
</head>
<body>
    <input type="text" id="numberInput" placeholder="Enter a number">
    <button onclick="calculate()">Calculate</button>

    <p id="result"></p>

    <script>
        function calculate() {
            let input = document.getElementById("numberInput").value;
            let convertedNumber = Number(input);

            let result = convertedNumber + 10;
            document.getElementById("result").textContent = "Result: " + result;
        }
    </script>
</body>
</html>


وقتی عددی را در قسمت ورودی وارد میکنم و روی دکمه «محاسبه» کلیک میکنم، نتیجه آنطور که انتظار میرود نیست. به عنوان مثال، اگر من "5" را وارد کنم، نتیجه نمایش داده شده "510" به جای "15" است.

کسی می تواند توضیح دهد که چرا این اتفاق می افتد؟ آیا چیزی در کدم گم شده است؟ چگونه می توانم قبل از انجام محاسبات مطمئن شوم که رشته به درستی به عدد تبدیل شده است؟ هر گونه بینش یا اصلاح کد بسیار قدردانی خواهد شد. متشکرم!
1402-06-10 10:34
حاجی شریفی
مؤسس سایت
 
سلام
بظاهر کدی که نوشته اید درست است!
ولی پیشنهاد میدهم از تابع parseInt استفاده کنید.
let  input = document.getElementById("numberInput").value ;
let  convertedNumber = parseInt(input)  ;

let  result = convertedNumber + 10 ;
document.getElementById("result").textContent = "Result: " + result ;