اذهب إلى المحتوى
  • 1

Makkah

محمد الحربي

السؤال

اطلب من المستخدم ادخال قيمةx و y
لما انقر على زر العمليات يكتب لي من تحت
اسفل الصفحه
مجموع القيمتين
ضرب القيمتين
طرح القيمتين
5
3
3+5=8
5-3=2
5*3=15

رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 0
بتاريخ 32 دقائق مضت قال محمد الحربي13:

اطلب من المستخدم ادخال قيمةx و y
لما انقر على زر العمليات يكتب لي من تحت
اسفل الصفحه
مجموع القيمتين
ضرب القيمتين
طرح القيمتين
5
3
3+5=8
5-3=2
5*3=15

السلام عليكم اخي @محمد الحربي13

لو سمحت ذكر لغة البرمجة التي تريد ان يتم تنفيذ الكود بها :)  لمساعدتك

تحياتي
شكرا لك

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 1 دقيقة مضت قال Mohamd Imran:

السلام عليكم اخي @محمد الحربي13

لو سمحت ذكر لغة البرمجة التي تريد ان يتم تنفيذ الكود بها :)  لمساعدتك

تحياتي
شكرا لك

html

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 43 دقائق مضت قال محمد الحربي13:

html

لعمل الية حسابية تحتاج الى لغة اخرى مع ال HTML  تفضل هنا استخدمت HTML + Javascript 

السكربت التالي لاخذ قيمة x,y من المستخدم للقيام بالعمليات الحسابية 
 

<!DOCTYPE html>
<html dir="rtl">
<head>
<meta charset=utf-8 />
<title>حساب قيمة المدخل </title>
<style type="text/css">
body {margin: 30px;

}

</style>
</head>
<body>
  <center>
<form>
X : <input type="text" id="firstNumber" /><br>
Y: <input type="text" id="secondNumber" /><br>
<input type="button" onClick="multiplyBy()" Value="ضرب" />
<input type="button" onClick="divideBy()" Value="تقسيم" />
<input type="button" onClick="minusBy()" Value="طرح" />
</form>
<p>النتيجة : <br>
<span id = "result"></span>
</p>
</center>
</body>

<script type="text/javascript">
      function multiplyBy()
      {
          num1 = document.getElementById("firstNumber").value;
          num2 = document.getElementById("secondNumber").value;
          document.getElementById("result").innerHTML = num1 * num2;
      }

      function divideBy()
      {
          num1 = document.getElementById("firstNumber").value;
          num2 = document.getElementById("secondNumber").value;
      document.getElementById("result").innerHTML = num1 / num2;
      }

      function minusBy()
      {
          num1 = document.getElementById("firstNumber").value;
          num2 = document.getElementById("secondNumber").value;
      document.getElementById("result").innerHTML = num1 - num2;
      }
</script>
</html>


وهنا سكربت لعرض قيمة x=5 ,y=3 على حسب العملية(ضرب,طرح,تقسيم) بشكل الي 

<!DOCTYPE html>
<html dir="rtl">
<head>
<meta charset=utf-8 />
<title>حساب قيمة المدخل </title>
<style type="text/css">
body {margin: 30px;

}

</style>
</head>
<body onload="javascript:multiplyBy();divideBy();minusBy()">>
  <center>


<p>حاصل ضرب X ,Y : <br>
</br>

<span id = "multiply"></span>
</br>
<p>حاصل قسمة X ,Y : <br>
</br>

<span id = "divide"></span>
</br>
<p>حاصل طرح X ,Y : <br>
</br>

<span id = "minus"></span>
</p>
</center>
</body>

<script type="text/javascript">

    x = 5;
    y = 3;
      function multiplyBy()
      {

          document.getElementById("multiply").innerHTML = x * y;
      }

      function divideBy()
      {

      document.getElementById("divide").innerHTML = x / y;
      }

      function minusBy()
      {

      document.getElementById("minus").innerHTML = x - y;
      }
</script>
</html>


اتمنى ان اكون قد افدتك :) 

تحياتي 
شكرا لك

تم التعديل في بواسطة Mohamd Imran
رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

السلام عليكم,

في هذا الكود استخدمت HTML+CSS+JavaScript+Jquery, و قد أرفقت الملف حتى لا تضطر للنسخ واللصق, و شكرا.

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- page style -->
    <style>
        body{
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }
        body>div, .form{
            display: flex;
            flex-direction: column;
            width: 50%;
            align-items: center;
        }
        .form > *:not(:last-child){
            margin-bottom: 10px;
        }
        
        .oper span{
            display: block;
        }
        .oper{
            align-self: end;
            display: none;
        }
    </style>
</head>
<body>
    <div>
        <div class="form">
            <label>أدخل قيمة X:</label>
            <input class="value x" type="number" value="0">
            <label>أدخل قيمة Y:</label>
            <input class="value y" type="number" value="0">
            <input type="submit" value="العمليات">
        </div>
        <div class="oper">
            <div class="values">
                <span></span>
                <span></span>
            </div>
            <div class="results">
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>
    </div>
    
    <!-- page script -->
    <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
    <script defer>

        $(".form input[type=submit]").click(function (){
            if($(".oper").is(":hidden"))
                $(".oper").slideDown().css("display", "block")

            let vals = [Number($(".x").val()), Number($(".y").val())],
                res = [vals[0] + vals[1], vals[0] - vals[1], vals[0] * vals[1]],
                i

            const valText = ["X هو", "Y هو"], resText = ["X+Y يساوي", "X-Y يساوي", "X*Y يساوي"]

            $(".values span").each(function (){
                i = $(this).index()
                $(this).text(`${valText[i]} ${vals[i]}`)
            })

            $(".results span").each(function (){
                i = $(this).index()
                $(this).text(`${resText[i]} ${vals[0]} ${["+", "-", "*"][i]} ${vals[1]} = ${res[i]}`)
            })
        })

    </script>
</body>
</html>

هذا هو الملف 1.html

هذا هو شكل الصفحة:

ice_screenshot_20200405-150423.thumb.png.91687322e97ea1354595118599734807.png

ice_screenshot_20200405-150538.thumb.png.3e74ff5ce4cc722a6feaf3fd69b50f36.png

تحياتي الحارة.

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...