Member 13134461 Ответов: 3

Как это сделать в java script

Сэр пожалуйста скажите мне,
два окна ввода значения добавить и получить результат в третье поле ввода и третье поле ввода много времени, чтобы как применить ява скрипт
пожалуйста, запустите майскую программу в браузере и, пожалуйста, дайте ответ, как сделать этот тип добавления полей ввода в java script

показано в ударе :-
<table border="1px">
<tr>
<td>Frist Value</td>
<td>+</td>
<td>Second value</td>
<td>=</td>
<td>Additon Result</td>
</tr>
<tr>
<td>2</td>
<td>+</td>
<td>3</td>
<td>=</td>
<td>5</td>
</tr>
<tr>
<td>5</td>
<td>+</td>
<td>3</td>
<td>=</td>
<td>8</td>
</tr>
<tr>
<td>1</td>
<td>+</td>
<td>1</td>
<td>=</td>
<td>2</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td>Total</td>
<td>15</td>
</tr>
</table>

пожалуйста, запустите майскую программу в браузере и, пожалуйста, дайте ответ, как сделать этот тип добавления полей ввода в java script

Как это сделать в java script пожалуйста, помогите в want to this in my collage .

Что я уже пробовал:

как это сделать в java script
я пытаюсь сложить две коробки и получить результат в третьей коробке и это третье значение коробки также добавить в другую коробку как это сделать

Mohibur Rashid

никто не сделает этого за тебя.
Пожалуйста, кратко опишите вашу проблему.
Опишите, где вы застряли.
Большинство из нас не горит желанием запускать ваш код.

3 Ответов

Рейтинг:
28

Karthik_Mahalingam

обратитесь к этому

Учебник По JavaScript[^]
Начните работу с отладки JavaScript в Chrome DevTools  |  Сеть  |  Разработчики Google[^]

<html>

<head>
    <script>
      function calc(obj){
          var value =obj.value;
          var cls = obj.className;
         var texts =  document.getElementsByClassName(cls);
           var a = texts[0].value;
           var b = texts[1].value;
           a = parseFloat(a);
           b= parseFloat(b);
           a = isNaN(a) ? 0 : a;
           b = isNaN(b) ? 0 : b;
           var sum =  a + b;
           document.getElementsByClassName(cls + cls)[0].textContent = sum;
           calTotal();
      }
      function calTotal(){
        var spans =  document.querySelectorAll('.aa,.bb,.cc')
        var total = 0;
         for(var i = 0; i <spans.length; i++){
             var value =  spans[i].textContent;
             value = parseFloat(value);
             value = isNaN(value)? 0:value;
             total+= value;
         }
            document.getElementsByClassName('total')[0].textContent = total;

      }

        </script>
        <style>
            .aa, .bb, .cc, .total{
             font-size: px;
             font-weight: bold;
            }
            </style>

</head>

<body>
    <table border="1px">
        <tr>
            <td>Frist Value</td>
            <td>+</td>
            <td>Second value</td>
            <td>=</td>
            <td>Additon Result</td>
        </tr>
        <tr>
            <td><input class="a" type="text" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="a" type="text" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="aa"></span>   </td>
        </tr>
        <tr>
            <td><input class="b" type="text" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="b" type="text" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="bb"></span>   </td>
        </tr>
        <tr>
            <td><input class="c" type="text" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="c" type="text" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="cc"></span>   </td>
        </tr>
        <tr>
            <td> </td>
            <td></td>
            <td></td>
            <td>Total</td>
            <td> <span class="total"></span>   </td>
        </tr>
    </table>
</body>

</html>


Демонстрация: - JSFiddle[^]

Member 13134461

СПАСИБО КАРТИК СЭР ЗА ПРАВИЛЬНЫЙ ОТВЕТ,
Но еще один вопрос в этой программе сделать только три заполненных текста, то как можно сделать для 100 текста в поле ввода заполненное значение и получить в ответ дополнительно результат, а также итог?

Karthik_Mahalingam

затем вам нужно зациклить его, чтобы создать 100 строк.

Member 13134461

как применить петлю
пожалуйста дайте мне ответ сэр

Karthik_Mahalingam

сейчас пойду спать, предоставлю Томо.

Karthik_Mahalingam 


<html>

<head>
    <script>
        function calc(obj) {
            
            var value = obj.value;
            var cls = obj.className;
            var no = cls.replace('row', '');
            var texts = document.getElementsByClassName(cls);
            var a = texts[0].value;
            var b = texts[1].value;
            a = parseFloat(a);
            b = parseFloat(b);
            a = isNaN(a) ? 0 : a;
            b = isNaN(b) ? 0 : b;
            var sum = a + b;
            document.getElementsByClassName('rowTotal' + no)[0].textContent = sum;
            calTotal();
        }
        function calTotal() {
            var spans = document.querySelectorAll('span[class^="rowTotal"]')
            var total = 0;
            for (var i = 0; i < spans.length; i++) {
                var value = spans[i].textContent;
                value = parseFloat(value);
                value = isNaN(value) ? 0 : value;
                total += value;
            }
            document.getElementsByClassName('mainTotal')[0].textContent = total;

        }

        document.addEventListener('DOMContentLoaded', function () {
            htmlpageload();
        });

        function htmlpageload() {
            var rowsCount = 10;
            var trs = [];
            for (var i = 0; i < rowsCount; i++) {
                var tds = [];
                tds.push('<td><input onkeyup="calc(this)" type="text" class="row' + i + '" /></td>');
                tds.push('<td>+</td>');
                tds.push('<td><input onkeyup="calc(this)" type="text" class="row' + i + '" /></td>');
                tds.push('<td>=</td>');
                tds.push('<td><span class="rowTotal' + i + '"></span></td>');
                trs.push('<tr>' + tds.join('')+'</tr>');
            }
            var tr = trs.join('');
            document.querySelector('#tbl tbody').innerHTML = tr;
        }

    </script>
    <style>
        span[class^="rowTotal"], .mainTotal {
            font-size: 15px;
            font-weight: bold;
        }
    </style>

</head>

<body>
    
    <table id="tbl" border="1">
        <thead>
            <tr>
                <td>Frist Value</td>
                <td>+</td>
                <td>Second value</td>
                <td>=</td>
                <td>Additon Result</td>
            </tr>
        </thead>
        <tbody></tbody>
        <tfoot>
            <tr>
                <td> </td>
                <td></td>
                <td></td>
                <td>Total</td>
                <td> <span class="mainTotal"></span>   </td>
            </tr>
        </tfoot>
    </table>
</body>

</html>

Karthik_Mahalingam

демонстрация
Edit fiddle - JSFiddle[^]

Member 13134461

сердечно благодарю вас сэр ,
Ты гений..........................................................!

Karthik_Mahalingam

:) добро пожаловать

Member 13134461

функция calc(obj){
ВАР значение =объект obj.значение;
ВАР с CLS = obj-файлы.класса;
ВАР текст = "документ".getElementsByClassName(ЦБС);
var a = texts[0]. значение;
var b = тексты[1]. значение;
a = parseFloat(a);
b= parseFloat(b);
a = isNaN(a) ? 0 : a;
b = isNaN(b) ? 0 : b;
var sum = a * b;
document.getElementsByClassName(cls + cls)[0]. textContent = sum;
calTotal();
}
функция calTotal(){
var spans = документ.querySelectorAll('.АА.ББ.чч,.ДД.ээ.ФФ.гг.чч,.второй,.Джей-Джей,.КК.Лл.мм,.НН.ОО,.ПП.с QQ,.руб.)
var total = 0;
для (var i = 0; i &lt;spans.длина; i++){
ВАР значение = диапазонов[я].текстового содержимого;
value = parseFloat(значение);
value = isNaN (значение)? 0: значение;
общая стоимость;
}
document.getElementsByClassName ('total') [0]. textContent = total;

};
$(функция() {
$( "#datepicker"). datepicker({
changeMonth: true,
changeYear: true,
yearRange:"-100:+0",
формат даты: "ДД / ММ/гг"
});
});



.АА .ББ .чч, .ДД .ээ.ФФ.гг.чч,.второй,.Джей-Джей,.КК.Лл.мм,.НН.ОО,.ПП.с QQ,.РР .общая{
размер шрифта: px;
шрифт-вес: жирный;
}
.headerb{
ширина:555px;
высота:которой 130px;
граница: 1px сплошной красный;
}
.установка{
ширина:600px;
граница: 1px пунктирная зеленая;

поплавок:центр;
}








Счет-Фактура Нет:                  
Дата:

Имя:       
Мобильный Нет:
Адрес:        
ДАТА РОЖДЕНИЯ:























































































































































Продукт DiscriptionUnit Цена+Количество=Количество + = + = + = + = + = + = + = + = + = +

Рейтинг:
2

Richard MacCutchan

Видеть Учебник По JavaScript[^].

Рейтинг:
0

Member 13134461

Как вставить значение тега span в базу данных

<html>
 
<head>
<link rel="stylesheet" href="css/smoothness/jquery-ui.css">
  <script src="js/jquery-1.9.1.js"></script>
   <script src="js/jquery-ui.js"></script>
    <script>
      function calc(obj){
          var value =obj.value;
          var cls = obj.className;
         var texts =  document.getElementsByClassName(cls);
           var a = texts[0].value;
           var b = texts[1].value;
           a = parseFloat(a);
           b= parseFloat(b);
           a = isNaN(a) ? 0 : a;
           b = isNaN(b) ? 0 : b;
           var sum =  a * b;
           document.getElementsByClassName(cls + cls)[0].textContent = sum;
           calTotal();
      }
      function calTotal(){
        var spans =  document.querySelectorAll('.aa,.bb,.cc,.dd,.ee,.ff,.gg,.hh,.ii,.jj,.kk,.ll,.mm,.nn,.oo,.pp,.qq,.rr')
        var total = 0;
         for(var i = 0; i <spans.length; i++){
             var value =  spans[i].textContent;
             value = parseFloat(value);
             value = isNaN(value)? 0:value;
             total+= value;
         }
            document.getElementsByClassName('total')[0].textContent = total;
 
      };
	    $(function() {
    $( "#datepicker" ).datepicker({
     changeMonth:true,
     changeYear:true,
     yearRange:"-100:+0",
     dateFormat:"dd/mm/yy"
  });
  });
 
        </script>
        <style>
            .aa, .bb, .cc, .dd, .ee,.ff,.gg,.hh,.ii,.jj,.kk,.ll,.mm,.nn,.oo,.pp,.qq,.rr, .total{
             font-size: px;
             font-weight: bold;
            }
			.headerb{
			width:555px;
			height:130px;
			border:1px solid red;
		}
		.setup{
			width:600px;
			border: 1px dotted green;
			
			float:center;
		}
            </style>
 
</head>
 
<body>
<div class="setup">
<div class="headerb">
<form method="post" action="insert.php" >
Invoice No:<input type="text" name="billno"/>                  
Date:<input name="date" class="datepicker" id="item34_date_1" required type="text"
data-hint="" value="<?php echo date('d/m/Y'); ?>" /><hr>

Name:<input type="text" name="cname"/>       
Mobile No:<input type="text" name="cmob"/><br><hr>
Address:<input type="text" name="cadd"/>        
DOB:<input type="text" name="txtdob"  id="datepicker"></td></tr>
</div>
    <table border="1px">
        <tr>
			<td>Product Discription</td>
            <td>Unit Price</td>
            <td>+</td>
            <td>Quantity</td>
            <td>=</td>
            <td>Amount</td>
        </tr>
        <tr>
			<td><input type="text" name="pro1"  /></td>
            <td><input class="a" type="text" name="up1" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="a" type="text" name="quan1" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="aa" type="hidden" name="amt1"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro2" /></td>
            <td><input class="b" type="text" name="up2" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="b" type="text" name="quan2" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="bb" name="amt2"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro3" /></td>
            <td><input class="c" type="text" name="up3" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="c" type="text" name="quan3" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="cc" name="amt3"></span>   </td>
        </tr>
		<tr>
			<td><input type="text" name="pro4" /></td>
            <td><input class="d" type="text" name="up4" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="d" type="text" name="quan4" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="dd" name="amt4"></span>   </td>
        </tr>
		<tr>
			<td><input type="text" name="pro5" /></td>
            <td><input class="e" type="text" name="up5" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="e" type="text" name="quan5" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="ee" name="amt5"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro6" /></td>
            <td><input class="f" type="text" name="up6" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="f" type="text" name="quan6" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="ff" name="amt6"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro7" /></td>
            <td><input class="g" type="text" name="up7" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="g" type="text" name="quan7" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="gg" name="amt7"></span>   </td>
        </tr>
        
		<tr>
			<td><input type="text" name="pro8" /></td>
            <td><input class="h" type="text" name="up8" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="h" type="text" name="quan8" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="hh" name="amt8"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro9" /></td>
            <td><input class="i" type="text" name="up9" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="i" type="text" name="quan9" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="ii" name="amt9"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro10" /></td>
            <td><input class="j" type="text" name="up10" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="j" type="text" name="quan10" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="jj" name="amt10"></span>   </td>
        </tr>
		<tr>
			<td><input type="text" name="pro11" /></td>
            <td><input class="k" type="text" name="up11" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="k" type="text" name="quan11" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="kk" name="amt12" ></span>   </td>
        </tr>
     
		
		<tr>
			<td><input type="text" name="pro12" /></td>
            <td><input class="l" type="text" name="up12" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="l" type="text" name="quan12" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="ll" name="amt12"></span>   </td>
        </tr>
       
		<tr>
			<td><input type="text" name="pro13" /></td>
            <td><input class="m" type="text" name="up13" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="m" type="text" name="quan13" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="mm" name="amt13"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro14" /></td>
            <td><input class="n" type="text" name="up14" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="n" type="text" name="quan14" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="nn" name="amt15"></span>   </td>
        </tr>
        <tr>
			<td><input type="text" name="pro15" /></td>
            <td><input class="o" type="text" name="up15" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input class="o" type="text" name="quan15" onkeyup="calc(this)"> </td>
            <td>=</td>
            <td> <span class="oo"></span>   </td>
        </tr>
		<tr>
			<td><input type="text" name="pro16" /></td>
            <td><input class="p" type="text" name="up16" onkeyup="calc(this)"> </td>
            <td>+</td>
            <td><input

Member 13134461

Как вставить следующее значение тега sapn в различных базах данных, пожалуйста, помогите мне