我在C#
有经验,但没有Javascript
的经验。我想要实现的目标不应该那么难,但我就是无法让它工作:
我想用文本框的文本属性填充标签的文本属性。这需要在KeyUpEvent
完成。
我已经创建了KeyUpEvent
并且它正在运行,但它不会使用以下代码填充标签的 text 属性:
<script type="text/javascript">
$(document).ready(function ()
{
$("#@Html.FieldIdFor(model => model.Quantity)").keyup(OnQuantityChanged);
});
function OnQuantityChanged()
{
alert("onQuantityChanged event fired.")
document.getElementById('#@Html.FieldIdFor(model => model.SubTotalExclTax)').value = document.getelementById('#@Html.FieldIdFor(model => model.UnitPriceExclTax)').value
}
</script>
所以我创建了一个名为 OnQuantityChanged()
的函数,并在KeyUp
事件上调用这个函数。我的函数中的警报:alert("onQuantityChanged event fired.")
被调用并向我显示一个对话框,因此该函数确实被调用。
我正在使用@Html.FieldIdFor
,以获取控件的 id。我认为这是由NopCommerce实现的,下面是FieldIdFor
方法的定义:
public static string FieldIdFor<T, TResult>(this HtmlHelper<T> html, Expression<Func<T, TResult>> expression)
{
var id = html.ViewData.TemplateInfo.GetFullHtmlFieldId(ExpressionHelper.GetExpressionText(expression));
// because "[" and "]" aren't replaced with "_" in GetFullHtmlFieldId
return id.Replace('[', '_').Replace(']', '_');
}
我想我犯了一个语法错误,但不知道如何调试Javascript,因为在Visual Studio(2012(中设置断点不会暂停代码。
我认为下面的行有一些不正确的语法,如果我错了,请纠正我:
document.getElementById('#@Html.FieldIdFor(model => model.SubTotalExclTax)').value = document.getelementById('#@Html.FieldIdFor(model => model.UnitPriceExclTax)').value
更新
页面的HTML如下:
<table>
<tr>
<td>
@Html.NopLabelFor(model => model.UnitPriceInclTax):
</td>
<td>
@Html.EditorFor(model => model.UnitPriceInclTax)@Model.UnitPriceInclTax
</td>
</tr>
<tr>
<td>
@Html.NopLabelFor(model => model.UnitPriceExclTax):
</td>
<td>
@Html.EditorFor(model => model.UnitPriceExclTax)@Model.UnitPriceExclTax
</td>
</tr>
<tr>
<td>
@Html.NopLabelFor(model => model.Quantity):
</td>
<td colspan="2">
@Html.EditorFor(model => model.Quantity, new { id = "lblQuantity"})
</td>
</tr>
<tr>
<td>
@Html.NopLabelFor(model => model.SubTotalInclTax):
</td>
<td>
@Html.EditorFor(model => model.SubTotalInclTax)@Model.SubTotalInclTax
</td>
</tr>
<tr>
<td>
@Html.NopLabelFor(model => model.SubTotalExclTax):
</td>
<td>
@Html.EditorFor(model => model.SubTotalExclTax)@Model.SubTotalExclTax
</td>
</tr>
</table>
- 使用 document.getElementById 时不需要 #,只需表示 id 的字符串就足够了。 没有
- 标签的值,您可以只设置 innerText 属性。
纯JavaScript解决方案:
document.getElementById("YourID").innerText = "New Text";
捷讯解决方案
$("#YourID").text("New Text");
服务器端代码的那部分不是由 ASP.NET 执行的,因为它位于字符串内。您可以使用变量来存储 id:
var subTotalId = @Html.FieldIdFor(model => model.SubTotalExclTax);
然后在javascript中使用subTotalId(假设Html.FieldIdFor返回元素的id。
更好的方法是只使用 javascript,使用 MVC ASP.NET 你应该知道 DOM 元素的 id,那么为什么你需要在运行时找到它们呢?为什么不使用Jquery:
$('#IdOfSubTotalElement').val();