使用 java 脚本选择器迭代字典

Question

我认为有一本字典，有 [输入ID，工具提示]。

另外，我在此页面中还有一组输入元素的 id。 我需要用我的元素 id 迭代字典：

 @{
 Dictionary<string, string> questionMarks = 
     ViewBag.QuestionMarks as Dictionary<string, string>;
 @}

 <script type="java-script">
 $(document).ready(function () {
    var inputs = $('input,select[type!="hidden"]');
    $.each(inputs, function(i, val) {
    if ($(val).attr('id')) { 
                var id = $(val).attr('id');

                var iter_string = '@questionMarks' + "[" + id + "]";
                alert(iter_string);              // [1]
                alert('@questionMarks["cvc"]');  // here i got tooltip
             }
    });
</script>

[1] 我有 System.Collection.Generic.Dictionary`2[System.String, System.String][cvc]

感谢 Jan Jongboom， 终于我得到了我想要的：

@using System.Web.Script.Serialization
@{
    Dictionary<string, string> questionMarks = ViewBag.QuestionMarks as Dictionary<string, string>;
    JavaScriptSerializer jss = new JavaScriptSerializer();
@}
<script type="text/javascript">
    var questionMarks = @Html.Raw(jss.Serialize((Dictionary<string, string>)ViewBag.QuestionMarks));     
    $(document).ready(function () {
        for ( keyVar in questionMarks ) {
            $('#' + keyVar).attr('original-title', questionMarks[keyVar]);
            $('#' + keyVar).tipsy({ gravity: 'w' });
        }
    });
</script>

Answer 1

执行类似的操作

<script>
var questionMarks = @new JavaScriptSerializer().Serialize((Dictionary<string, string>)ViewBag.QuestionMarks) ;
</script>

现在您有一个名为 questionMarks 的 javascript 变量，您可以对其进行迭代。

Answer 2

不，您不能通过服务器变量从客户端代码进行迭代。您可以从 JS 变量（如 JSON）生成初始化代码或在服务器端生成必要​​的 html。您还可以通过 ajax 请求从 jsavascript 请求此类数据。

Answer 3

在绘制输入时将数据属性附加到输入应该可以帮助您解决这一问题。

示例： http://jsfiddle.net/Krch9/

$(document).ready(function(e) {
    var inputs = $("input", "#container");
    $.each(inputs, function(i, val) {
        var ToolTipText = $(this).data('tooltiptext');
        /// Run your tooltip plugin here ...
        $("#output").html($("#output").html() + "<br>" + $(this).attr('id') + " : " + ToolTipText);
    });
});

使用 MVC 帮助程序，您可以轻松添加它们：

@Html.TextBoxFor(x => x.Field, new { data_tooltiptext = "Blah blah"});

标记将最终看起来像这样：

<input type="text" id="Field" data-tooltiptext="Blah blah">

编辑：额外帮助

I.E 循环遍历你的元素

foreach( var question in questionMarks) {
   @Html.TextBox(question.Key, new { data_tooltiptext = question.Value} );
}

然后使用 javascript 示例（你需要根据你的需要修改它......）在元素上运行插件

Answer 4

要删除引号，请使用 Html.Raw()

var questionMarks = '@Html.Raw(jss.Serialize((Dictionary<string, string>)ViewBag.QuestionMarks))';