basitsar Ответов: 3

Вычисления в JavaScript

Привет,

Мне нужен расчет в javascript.

Ниже приведен мой код в .net

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

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            width: 128px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        <table class="style1">
            <tr>
                <td class="style2">
                    <asp:Label ID="Label1" runat="server" Text="Total Amount"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td class="style2">
                    <asp:Label ID="Label2" runat="server" Text="Discount Percent"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td class="style2">
                    <asp:Label ID="Label3" runat="server" Text="Toatl % Amount"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td class="style2">
                    &nbsp;</td>
                <td>
                    <asp:Button ID="Button1" runat="server" Text="Calculate" />
                </td>
            </tr>
            <tr>
                <td class="style2">
                    &nbsp;</td>
                <td>
                    &nbsp;</td>
            </tr>
        </table>
    
    </div>
    </form>
</body>
</html>


Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
        TextBox3.Text = TextBox1.Text * TextBox2.Text / 100
    End Sub


i want above code behind code in javascript.
 
Thanks
Basit.

3 Ответов

Рейтинг:
27

Thomas Daniels

Вы можете положить это script- тег к вашему head:

<script>
window.addEventListener("load", function() {
    document.getElementById("<%= Button1.ClientID %>").addEventListener("click", function() {
        var textbox1value = parseFloat(document.getElementById("<%= TextBox1.ClientID %>").value);
        var textbox2value = parseFloat(document.getElementById("<%= TextBox2.ClientID %>").value);
        document.getElementById("<%= TextBox3.ClientID %>").value = (textbox1value * textbox2value / 100).toString();
    });
});
</script>

Прослушиватель событий "load" гарантирует, что функция (переданная в качестве второго аргумента) будет вызвана при загрузке страницы. То <%= Button1.ClientID %> оценки (и подобные им позже) убедитесь, что сценарий в HTML-ответе содержит правильные идентификаторы элементов на стороне клиента (их идентификатор на стороне клиента не обязательно является идентификатором на стороне сервера). Затем обработчик "click" выполняет функцию при нажатии кнопки, parseFloat преобразует значения текстового поля в числа с плавающей запятой, а затем ваша операция выполняется над этими значениями и результат помещается в TextBox3.

basitsar

Большое спасибо. Но o / p приближается.

Thomas Daniels

О, это моя вина. Я попытался преобразовать элемент *в float, а не в его значение. Я все исправил.

basitsar

Большое спасибо. Ниже код решил проблему в Мастере.


функция расчета() {
ВАР = документ myBox1.метода getElementById("&амп;ЛТ;%= текстовое поле textbox1.Идентификатора ClientID %и GT;").значение;
ВАР myBox2 = документ.метода getElementById("&амп;ЛТ;%= поле textbox2.Идентификатора ClientID %и GT;").значение;
var result = document. getElementById ('результат');
document. getElementById("& lt;%= txtDiscount.ClientID %>"). value = ((myBox1 - myBox2) / myBox1) * 100;
}

Рейтинг:
1

Hrishikesh

----с фоновым кодом------

Защищенный суб Button1_Click (ByVal sender As Object, ByVal e As EventArgs) обрабатывает Button1.Щелчок
Textbox3 и.Текст = Элемент Textbox1.Текст * Поле Textbox2.Текст / 100
Конец Подводной Лодки

-- Код в JQuery------

$("#Button"). click (функция(){
var val1, val2,val3;
val1=разбор.Float ($("#Textbox1"). val());
val2=разбор.Float ($("#Textbox2"). val());
val3=val1*val2 / 100;
$("#TextBox3"). val(val3);
});

Рейтинг:
1

basitsar

Ниже приведено решение вышеописанного, я попробовал с нижеприведенным кодом.

Спасибо за помощь.

<html>
<head id="Head1" runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            width: 128px;
        }
    </style>
<script>
    function calculate() {
        var myBox1 = document.getElementById('box1').value;
        var myBox2 = document.getElementById('box2').value;
        var result = document.getElementById('result');
        var myResult = myBox1 * myBox2 / 100;
        result.value = myResult;


    }

</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        <table class="style1">
            <tr>
                <td class="style2">
                    <asp:Label ID="Label1" runat="server" Text="Total Amount"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="box1" runat="server" oninput="calculate()" ></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td class="style2">
                    <asp:Label ID="Label2" runat="server" Text="Discount Percent"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="box2" runat="server" oninput="calculate()" ></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td class="style2">
                    <asp:Label ID="Label3" runat="server" Text="Toatl % Amount"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="result" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td class="style2">
                    &nbsp;</td>
                <td>
                    <asp:Button ID="Button1" runat="server" Text="Calculate" />
                </td>
            </tr>
            <tr>
                <td class="style2">
                    &nbsp;</td>
                <td>
                    &nbsp;</td>
            </tr>
        </table>
    
    </div>
    </form>
</body>
</html>

F-ES Sitecore

Этот код не будет работать, если текстовые поля находятся внутри контейнера или если вы начнете использовать мастер-страницы. Вы должны использовать ClientID, как это было предложено в другом решении, и это гарантирует, что ваш код будет работать везде, где находятся текстовые поля.