• 0

خطأ في العمليات الحسابية Javascript

بسم الله الرحمن الرحيم

السلام عليكم

 

قمت بتصميم أداة تقوم بعمل حسابات رياضية بسيطة جداً لكن النواتج تظهر بشكل خاطئ في حال تجاوزت الرقم 9 في أي حقل

 

<!DOCTYPE html>
<html>
    
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>A tool</title>
        <meta name="description" content="A tool">
        
        <link rel="stylesheet" href="main.css">

    </head>
    <body>
        
        <h1>أداة تعديل متوسط التكلفة للسهم</h1>

        <h3>Input from user</h3>
        <label>التكلفة القديمة</label><input type="number" id="oldCost" /><br>
        <label>الكمية القديمة</label><input type="number" id="oldQuantity" /><br><br>
        
        <label>التكلفة الجديدة</label><input type="number" id="newCost" /><br>
        <label>الكمية الجديدة</label><input type="number" id="newQuantity" /><br>
        

        
        
        <h3>Output</h3>
        <button onclick="cacl()">احسب</button><br><br>
        <label>السعر الجديد المعدل: </label><div id="Caclulate"></div>
        
        <h4>note:</h4>
        <p><b>السعر الجديد المعدل = (التكلفة القديمة + التكلفة الجديدة) / (الكمية القديمة + الكمية الجديدة)</b></p>
        
        <!-- JavaScript -->
        
        <script src="main.js"></script>
    </body>
</html>

CSS:

html {
    background: #e6e9e9;
    background-image: linear-gradient(270deg, rgb(230, 233, 233) 0%, rgb(216, 221, 221) 100%);
    -webkit-font-smoothing: antialiased;
}

body {
    direction: rtl;
    background: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
    color: #545454;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    margin: 0 auto;
    max-width: 800px;
    padding: 2em 2em 4em;
}

h1, h2, h3, h4, h5, h6 {
    color: #222;
    font-weight: 600;
    line-height: 1.3;
}

b, strong {
    font-weight: 600;
}

input {
    margin: 5px;
}

JavaScript:

/*global console, alert, prompt*/



var oldPrice_input = document.getElementById("oldPrice").value,
    oldQuantity_input = document.getElementById("oldQuantity").value,
    oldCost_input = document.getElementById("oldCost").value,
    
    newPrice_input = document.getElementById("newPrice").value,
    newQuantity_input = document.getElementById("newQuantity").value,
    newCost_input = document.getElementById("newCost").value,

    oldPrice_output = oldCost_input / oldQuantity_input,
    newPrice_indep_output = newCost_input / newQuantity_input,
    TotalQuantity_output = oldQuantity_input + newQuantity_input,
    TotalCost_output = oldCost_input + newCost_input,
    newPrice_output = TotalCost_output / TotalQuantity_output;
    
function cacl() {
    "use strict";
    document.getElementById("Caclulate").innerHTML =
        [(document.getElementById("oldCost").value + document.getElementById("newCost").value)] / [(document.getElementById("oldQuantity").value + document.getElementById("newQuantity").value)];
}

 

نفترض التالي:

التكلفة القديمة = 10

الكمية القديمة = 1

التكلفة الجديدة = 10

الكمية الجديدة = 1

 

الناتج الصحيح المفترض هو : 10 لكن الذي يظهر هو : 91.81818181818181

فما هي المشكلة؟

 

علماً بأن المعادلة المستخدمة هي:

السعر الجديد المعدل = (التكلفة القديمة + التكلفة الجديدة) / (الكمية القديمة + الكمية الجديدة)

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

السلام عليكم.

قم بتحويل النص الي رقم صحيح قبل إجراء العمليات الحسابيه

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 2 ساعات قال Hamada Sayed:

السلام عليكم.

قم بتحويل النص الي رقم صحيح قبل إجراء العمليات الحسابيه

وعليكم السلام

كيف يمكنني ذلك؟ (مبتدئ)

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

استخدم 

parseInt

لتحويل النص الي رقم صحيح.

var num=document.getElementById("..."). value

num=parseInt(num);

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ منذ ساعة مضت قال Hamada Sayed:

استخدم 

parseInt

لتحويل النص الي رقم صحيح.

var num=document.getElementById("..."). value

num=parseInt(num);

لم تعمل معي :(

/*global console, alert, prompt*/



var oldQuantity_input = document.getElementById("oldQuantity").value,
    oldCost_input = document.getElementById("oldCost").value,


    newQuantity_input = document.getElementById("newQuantity").value,
    newCost_input = document.getElementById("newCost").value,

    
    TotalQuantity_output = oldQuantity_input + newQuantity_input, // إجمالي الكمية
    TotalCost_output = oldCost_input + newCost_input, // إجمالي التكلفة

    newPrice_output = TotalCost_output / TotalQuantity_output, // السعر الجديد المعدل

    textToNum = parseInt(oldQuantity_input, oldCost_input, newQuantity_input, newCost_input, TotalCost_output, TotalQuantity_output, newPrice_output);
    
function cacl() {
    "use strict";
    document.getElementById("Caclulate").innerHTML = newPrice_output;
}

 

أصبحت النتيجة undefined

تمّ تعديل بواسطة iAbdullah95
1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

لا أعلم اذا كانت الطريقه parseInt تعمل علي متصفح مايكروسوفت.

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 34 دقائق مضت قال Hamada Sayed:

لا أعلم اذا كانت الطريقه parseInt تعمل علي متصفح مايكروسوفت.

 

أستخدم Chrome

 

هذا هو العمل كاملاً:

https://jsfiddle.net/iAbdullah95/Lqwj4d9b/3/

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

اذا كانت النتيجه undefined

استخدم stringToNumber

function stringToNumber(str){ str=new String(str+"");

if ("parseInt" in window) return parseInt(str);

var num=0, n=1, i=str.length-1, ch;

for (;i>-1; i--){

ch=str.charAt(i);

if (ch<='9' && ch>='0'){

ch=ch&15;

num=num+(ch*n);

n=n*10;

} else break;

}

return num;

}

مع العلم ان الطريقه stringToNumber يمرر لها وسيط واحد.

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 2 ساعات قال Hamada Sayed:

اذا كانت النتيجه undefined

استخدم stringToNumber

function stringToNumber(str){ str=new String(str+"");

if ("parseInt" in window) return parseInt(str);

var num=0, n=1, i=str.length-1, ch;

for (;i>-1; i--){

ch=str.charAt(i);

if (ch<='9' && ch>='0'){

ch=ch&15;

num=num+(ch*n);

n=n*10;

} else break;

}

return num;

}

مع العلم ان الطريقه stringToNumber يمرر لها وسيط واحد.

هذا الكود صعب جدا، مستواي مبتدئ جدا.

هل يمكنك أن تلقي نظرة على الرابط في ردي السابق؟ وتقوم بإصلاح الخلل ثم سأحاول فهم الطريقة

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

الويب سايت فارغ ولا يوجد به شئ مفيد.

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 3 دقائق مضت قال Hamada Sayed:

الويب سايت فارغ ولا يوجد به شئ مفيد.

غريب!

يظهر لي دون مشاكل:

 

https://jsfiddle.net/iAbdullah95/Lqwj4d9b/3/

 

هل تستطيع مشاهدة الاكواد على الأقل؟

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

استبدل الfunction

function cacl() { "use strict"; document.getElementById("Caclulate").innerHTML = [(document.getElementById("oldCost").value + document.getElementById("newCost").value)] / [(document.getElementById("oldQuantity").value + document.getElementById("newQuantity").value)]; }

 

بالfunction

function cacl() {
    "use strict";
    document.getElementById("Caclulate").innerHTML =
        (parseInt(document.getElementById("oldCost").value) + parseInt(document.getElementById("newCost").value)) / (parseInt(document.getElementById("oldQuantity").value) + parseInt(document.getElementById("newQuantity").value));
        }

وإحرص علي ان لا تكون قيمه المقسوم عليه صفر وإلا ستظهر لك النتيجه infinity

تمّ تعديل بواسطة Hamada Sayed

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ On 9‏/11‏/2018 at 20:46 قال Hamada Sayed:

استبدل الfunction

function cacl() { "use strict"; document.getElementById("Caclulate").innerHTML = [(document.getElementById("oldCost").value + document.getElementById("newCost").value)] / [(document.getElementById("oldQuantity").value + document.getElementById("newQuantity").value)]; }

 

بالfunction

function cacl() {
    "use strict";
    document.getElementById("Caclulate").innerHTML =
        (parseInt(document.getElementById("oldCost").value) + parseInt(document.getElementById("newCost").value)) / (parseInt(document.getElementById("oldQuantity").value) + parseInt(document.getElementById("newQuantity").value));
        }

وإحرص علي ان لا تكون قيمه المقسوم عليه صفر وإلا ستظهر لك النتيجه infinity

ممتاز يعمل بشكل رائع الآن، لكن قمت بعدة عمليات لتطوير البرنامج وتوقف وأصبحت النتيجة NaN ! لم أفهم أين الخطأ بالتحديد؟

الكود الجديد هنا

https://jsfiddle.net/iAbdullah95/Lqwj4d9b/6/

تمّ تعديل بواسطة iAbdullah95

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

البرنامج محتاج تطوير للتأكد من ان الحقول توجد بها قيم وان القيم ارقام وليست حروف او ارقام وحروف.

والبرنامج قد يعمل معك اذا كانت الارقام تتوسطها حروف او تنهاها.

تمّ تعديل بواسطة Hamada Sayed

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن