在html5中设置另一个文本框的文本框的值asp.net

我的mvc4 asp.net视图中有3个文本框。在html5中设置另一个文本框的文本框的值asp.net

代码为： -

<table> 
<tr><td>A:</td><td>@Html.TextBox("A")</td></tr> 
<tr><td>B:</td><td>@Html.TextBox("B")</td></tr> 
<tr><td>Answer:</td><td>@Html.TextBox("C")</td></tr> 
</table>

例如，我要的是，

，只要我在文本框一个在文本框B，答案“中输入 “3” 和 “2” 5 “应该立即显示在TextBox C中，而不需要我点击任何提交按钮。

我该怎么做？

谢谢。

来源

2013-10-28 Mirage

将股利和实现自己的任务.... – Hariharan

这里使用JQuery

SAMPLE DEMO

对于使用JQuery，你需要添加JQuery的LIB在另一个解决方案您头标签，只需将下面的行粘贴到头标签中即可。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

JQuery的：

<script type="text/javascript" > 

$(document).ready(function(){ 

    $("#Txt_1").on('input', function() { 
     sumCal(); 
    }); 

    $("#Txt_2").on('input', function() { 
     sumCal(); 
    }); 

    function sumCal() { 

     var txt1 = $("#Txt_1").val(); 
     var txt2 = $("#Txt_2").val(); 
     var result = Number(txt1) + Number(txt2); 
     $("#Txt_3").val(result); 
    } 
}); 
</script>

来源

2013-10-28 08:06:19

谢谢，您的代码按预期工作。但我从来没有使用JQuery，所以我不知道如何与我的代码集成。你有什么建议？ – Mirage

@Mayur：查看我更新的答案，如何添加jquery lib –

太棒了！工作完全像我想... 感谢您的帮助！ :) – Mirage

你需要使用某种形式的Javascript才能做到这一点。这里是一块香草的JavaScript的这增加了一个事件处理程序到A和B两者，其比较文本框的值，并且如果条件满足显示在C所需的值：

// Get all the textboxes by their IDs 
var textboxA = document.getElementById("A"); 
var textboxB = document.getElementById("B"); 
var textboxC = document.getElementById("C"); 
// Add a handler for the keyup event 
textboxA.addEventListener("keyup", showAnswer, false); 
textboxB.addEventListener("keyup", showAnswer, false); 

function showAnswer() { 
    // Convert the values from a string to a float 
    var valA = parseFloat(textboxA.value); 
    var valB = parseFloat(textboxB.value); 
    // Make sure both values are valid numbers 
    if(!isNaN(valA) && !isNaN(valB)) { 
     // Show the calculated value in the C box 
     textboxC.value = valA + valB; 
    } 
    else { 
     // Can't do any calculations, just show a blank value 
     textboxC.value = ""; 
    } 
}

这里是一个fiddle到演示。

有使用jQuery这样做更容易方式：

$(function() { 
    $("#A, #B").on("keyup blur", function() { 
     var valA = parseFloat($("#A").val()); 
     var valB = parseFloat($("#B").val()); 
     if(!isNaN(valA) && !isNan(valB)) { 
      $("#C").val(valA + valB); 
     } 
     else { 
      $("#C").val(""); 
     } 
    }); 
});

来源

2013-10-28 07:57:39 CodingIntrigue

我在的问题给了仅仅是一个例子，值将并不总是3和2. 它不断变化... 而我是新来的JavaScript，所以我仍然不知道如何处理。 – Mirage

基本计算器的最新答案 – CodingIntrigue

试试这个

$(document).ready(function(){ 

    $("#txtbox2").keyup(function(){ 
    var txt01= parseInt ($("#txtbox1").val(),10); 

var txt02= parseInt($("#txtbox2").val(),10); 

$("#txtbox3").val(txt01+txt02); 

    }); 
});

来源

2013-10-28 08:39:53 meer

在html5中设置另一个文本框的文本框的值asp.net

回答

相关问题