0

我有我喜欢的字符串

5: "White", 6: "Yellow", 7: "Pink"

我需要这样的字符串视图

s={5: "White", 6: "Yellow", 7: "Pink"};

附加它以在表单上选择

   for (var a in myOpts) 
   {
        var t = document.createElement("OPTION");
        t.value = a;
        t.appendChild(document.createTextNode(myOpts[a]));
        selectObj.appendChild(t);
    }
4

2 回答 2

0

但是，您的问题有点不清楚-我会尝试猜测您在说什么，涵盖所有情况并提供一些附加值；）

我假设您在 JSP 页面中有一个服务器端字符串，其值为

5: "White", 6: "Yellow", 7: "Pink"

是什么让它看起来像

 <%
 String data = "5: \"White\", 6: \"Yellow\", 7: \"Pink\"";
 %>

现在您想将其写入文档，以便for稍后在客户端代码中使用。

从这个意义上说 - 您需要区分少数情况。

虽然当服务器将它写入响应文档时它是一个字符串 - 客户端代码可以通过不同的方式获取此值。在所有这些中 - 服务器必须以特定方式写入数据，以便客户端可以访问它，但是，有效性规则是不同的。

写一个对象字面量

实际上 - 我认为这就是你想要做的。客户端代码不会将其作为字符串 - 而是作为对象文字。

<script>
var sObjData = {<%= safeJs(data) %>};
</script>

这种选择的限制是来自服务器代码（在 内<%%>）和来自标记（在 外<%%>）的任何内容都必须作为有效的 JavaScript 对象字面量一起工作。有很多事情会破坏这个 Object 字面量的合法性——比如损坏的字符串、缺少逗号、缺少冒号等等。虽然这是推荐的方式 - 你必须知道你在做什么，我建议你把这些知识拉开，你的例子是一个好的开始。

在您的示例中 - 这呈现为有效的 JavaScript Object-Literal，并且问题不存在。

<script>
var sObjData = {5: "White", 6: "Yellow", 7: "Pink"};
</script>

这是一个完全合法的对象字面量，可以用在for- 就像你做的那样。

可能是您的示例简化了您的案例，并且您使用的字符串可能会破坏您的执行。以下是如何处理从服务器到客户端代码的字符串：

写一个 JavaString 字符串

在这种情况下的限制 - 是data字符串中可能破坏 JavaSctipt 字符串的任何字符 - 必须为 javascript进行转义。

但是，在这里我只处理整个data值 - 请记住，您可能希望对放入 this 中的每个值执行相同的操作data。

这是解释为 JavaScript 转义 Java 字符串的最简单实现：

<%!
    String safeJs(String data){
        return data.replace("\"","\\\"") //why three? two emit a sigle \ and the third escape the "
                   .replace("'","\\'")
                   .replace("\n","\\n")  //why two? you're not escaping n, your're emitting \ and n
                   .replace("\r","\\r"); //    that will render as escaping for the client code
    }
%>
<script>
var sObjData = '<%= safeJs(data) %>';
<script>

这部分将确保您将所有数据从服务器获取到客户端，并且客户端可以访问这些数据。从那里开始 - 这是您自己的数据传输协议并在客户端解析它的问题。

但是，并不总是建议这样做：如果您提供的所有内容都可以表述为 Object Literal - 它会更好 - 因为浏览器会在已编译的代码中为您处理解析，并为脚本代码提供现成的对象.

除非您想解析自己的字符串协议，否则它会得到与以下相同的结果，那何必呢？更符合safeJs你的价值观。

<script>
var sObjData = '<%= safeJs(data) %>';
var oObjData = eval("{" + oObjData + "}");
<script>

将字符串写入 TextArea 的内容

这是在服务器和 HTML 客户端之间传递字符串的最可靠的方式——因为唯一可以破坏的就是数据字符串是否包含 TextArea 的结束标记。

文本区域不受换行符的影响，它不受引号（单引号和双引号）的影响，唯一的弱点是它自己的结束标记。

请注意，将“”替换为“<textarea>”，将“”替换为“<textarea>”。

为文本区域分配一个 ID 并将其放入可style="display:none"确保它不会打扰 UI，但仍可访问。

<textarea style="display:none" id="txtData"><%=data.replace("</","&lt;/")%></textarea>
<script>
    var s = document.getElementById("txtData");
</script>

在 Select 中构建选项

DHTML 技巧的createElement作品，然而，我很少使用它，因为它很麻烦，而且性能非常低。但是 - 如果您设法正确编写您的 Object Literal - 它应该可以工作。

注入 HTML

与其创建一个选择并尝试填充它 - 将其完全注入 DOM 会更快、更可靠。

我为此使用以下实用程序：

function getStringBuffer(){
    var bfr = [];
     bfr.add = function() {
        for(var i=0;i<arguments.length;i++) {
           this[this.length] = arguments[i];
        }
     }
     bfr.toString = function() { return this.join("") }
     return bfr;
}

包装(function(){ 并})()创建一个匿名函数并立即执行它 - 确保为这项工作声明的任何变量都不会污染全局范围。

第一种方式 - 使用document.write：

<script>
(function(){
  var HTML = getStringBuffer();
  var k;

  HTML.add("<select id='selectObj'>");
  for (k in myOpts)  {
      HTML.add("<option value='", k, "'>", myOpts[k],"</option>");
  }
  HTML[HTML.length] = "</select>";

  document.write(HTML); //note the overriden toString method that will be called here
})();
</script>

第二种方式 - 使用 innerHTML 你可以做同样的事情，而不是 document.write - 使用容器标签来标记选择的位置，并在 DOM 完成加载后将其注入那里。

它与第一种方式相同，但有一个区别：相反document.write(HTML);- 放置一个容器，说出<span id="oSelectPlace"></span>您希望选择的位置，然后使用 document.getElementById("oSelectPlace").innerHTML = HMTL;

于 2011-03-15T09:36:33.540 回答
0

如果你json_decode的字符串是 s，你将得到一个具有 3 个自有属性的普通对象。然后，您可以使用构造循环这些属性for..in：

var myOpts, s='{5: "White", 6: "Yellow", 7: "Pink"}';
eval('myOpts='+s); // or better, a json parser
for(var a in myOpts) {
    if(myOpts.hasOwnProperty(a)) {
       // your dom code here
    }
}
于 2011-03-15T08:35:52.517 回答