0

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

我想用文本框的文本属性填充标签的文本属性。这需要在KeyUpEvent.

我已经创建了KeyUpEvent它并且它正在工作，但它没有使用以下代码填充我的标签的文本属性：

<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>
4

2 回答 2

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

纯javascript解决方案：

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

jQuery解决方案

$("#YourID").text("New Text");
于 2013-09-27T10:38:48.263 回答
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();
于 2013-09-27T10:29:20.153 回答