【发布时间】：2013-01-01 21:52:45
【问题描述】：
我有一些代码可以接收字符串，将其转换为对象，并允许我通过表单进行编辑。我有一个导入函数，它允许我将另一个字符串引入同一个对象，并且我可以在我的网络表单上定位。
我正在尝试使用 DropDown 控件来选择要在表单中查看的对象中的哪个属性。
我的问题是，一旦我将下拉菜单设置为我拥有的 3 个选项中的 1 个并单击导入，但是创建目标属性需要多次，它会中断并且不允许我专注于不同的属性。最好让我带你完成我的演示。
1. 在这里演示：http://jsfiddle.net/vJBQq/1/
2. 将下拉菜单设置为“View_3”
3. 单击导入按钮 3 次，表单将填充
4. 在这个阶段，它已经动态创建了3个Properties 'View_1'、'View_2'和'View_3。而您正在查看 View_3。
5. 尝试使用下拉菜单来定位一个说 View_1。它不起作用。
现阶段我有两个问题。
一种）。下拉列表不针对任何其他属性
乙）。现在表单已被填充，“导入”按钮也不再起作用。两个控件都返回 - ReferenceError: Button is not defined
我做错了什么来打破这个。
我的代码'：
var cleanStr = '';
var viewDropDown;
$(document).ready(function() {
//Import String
$('#import').click(function() {
ParseFunction();
});
});
//--------------------Run Import Parse and Set String------------------------------
//Build Initial Object LIst
function ParseFunction(parameterOne) {
$(document).on('change', '#selectView', function () {
ParseFunction();
});
newStr = 'View{ Image { BackgroundImage: Image.gif; Position: 0, 0; Width: 320; Height: 480; } Button { BackgroundImage: Button.gif; Transition: View2; Position: 49, 80; Width: 216; Height: 71; } Button { BackgroundImage: Button2.gif; Position: 65, 217; Width: 188; Height: 134; } Label { Position: 106, 91; Width: 96; Height: 34; Text: "Button"; FontSize: 32; Color: 0.12549, 0.298039, 0.364706, 1; } Scroll { Position: 106, 91; Width: 96; Height: 34; Button{ BackgroundImage: Button2.gif; Position: 65, 217; Width: 188; Height: 134; } Button{ BackgroundImage: Button2.gif; Position: 65, 217; Width: 188; Height: 134; } }}' + ' ';
str = cleanStr += newStr;
// Set viewDropDown to current selectView State
viewDropDown = $('#selectView').val();
var i = {};
str = str.replace(/(\w+)\s*\{/g, "$1:{"); // add in colon after each named object
str = str.replace(/\}(\s*\w)/g, "},$1"); // add comma before each new named object
str = str.replace(/;/g, ","); // swap out semicolons with commas
str = str.replace(/,(\s+\})/g, "$1"); // get rid of trailing commas
str = str.replace(/([\d\.]+(, [\d\.]+)+)/g, "[$1]"); // create number arrays
str = str.replace(/"/g, ""); // get rid of all double quotes
str = str.replace(/:\s+([^\[\d\{][^,]+)/g, ':"$1"'); // create strings
//str = str.replace(/([^:]+):{/g, function(m, p1) { return p1 + "_" + (++i).toString() + ":{"; });
str = str.replace(/(\S+):{/g, function (m, p1) {
i[p1] = (i[p1] || 0) + 1;
return p1 + "_" + i[p1].toString() + ":{";
});
//console.log(str);
var objStr;
eval("objStr={" + str + "};");
//End Parse String
console.log(objStr)
$('#importCode').remove();
var $objectList = $('<div id="importCode" />').appendTo($('#code'));
$.each(objStr[viewDropDown], function (k, v) {
$('<div/>').append(k).appendTo($objectList).on('click', function () {
$('#options .wrapper').show();
$('#options div div').hide();
var $wrapper = $('#options .wrapper').empty();
if (typeof v === 'string') {
$('<div class="item" />').append('<span class="key">' + k + '</span>' + '<input value="' + v + '"/>').appendTo($wrapper);
} else { //object
$('<h3 class="formHeading" />').append(k).appendTo($wrapper);
$.each(v, function (key, val) {
$('<div class="item" />').append('<span class="key">' + key + '</span>' + '<input value="' + val + '"/>').appendTo($wrapper);
});
}
$("<button>Save</button>").appendTo($wrapper).on('click', function () {
if (typeof v === 'string') {
v = $(this).closest(".wrapper").find("input").val();
} else { //object
$(this).closest(".wrapper").find(".item").each(function (i, div) {
var $div = $(div),
key = $div.find(".key").text(),
val = $div.find("input").val();
v[key] = val;
});
}
});
});
cleanStrPre = JSON.stringify(objStr);
cleanStr = cleanStrPre.substring(1,cleanStrPre.length-1);
$('#print').append(cleanStr);
});
};
【问题讨论】：
标签： javascript jquery json forms object