Question

我有C#的经验，但Javascript没有任何经验。我想要实现的目标不应该那么难，但我无法让它发挥作用：

我想用文本框的text属性填充标签的text属性。这需要在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>

Answer 1

ASP.NET不执行服务器端代码的那部分，因为它在字符串中。您可以使用变量来存储id：

var subTotalId = @Html.FieldIdFor(model => model.SubTotalExclTax);

然后在你的javascript中使用subTotalId（假设Html.FieldIdFor返回元素的id。

更好的方法是只使用javascript，使用ASP.NET MVC你应该知道DOM元素的id，那么为什么你需要在运行时找到它们？为什么不使用Jquery：

$('#IdOfSubTotalElement').val();

Answer 2

使用document.getElementById时不需要＃只是表示id的字符串就足够了。
您可以设置innerText属性没有标签值。

纯JavaScript解决方案：

document.getElementById("YourID").innerText = "New Text";

JQuery解决方案

$("#YourID").text("New Text");

用另一个MVC填充控件

2 个答案: