文字列を取り込んでオブジェクトに変換し、フォームから編集できるようにするコードがいくつかあります。別の文字列を同じオブジェクトに取り込むことができるインポート関数があり、Web フォームをターゲットにすることができます。
ドロップダウン コントロールを使用して、フォームに表示するオブジェクトのプロパティを選択できるようにしようとしています。
私の問題は、ドロップダウンを 3 つのオプションのうちの 1 つに設定して [インポート] をクリックすると、ターゲット プロパティを作成するのに何度も時間がかかり、別のプロパティに集中できなくなることです。デモをご案内します。
1. ここでデモ: http://jsfiddle.net/vJBQq/1/
2. ドロップダウンを「View_3」に設定します。
3. [インポート] ボタンを 3 回クリックすると、フォームに入力されます。そして、あなたは View_3 を見ています。
5. ドロップダウンを使用して、たとえば View_1 をターゲットにしてみてください。それは動作しません。
この段階で 2 つの問題があります。
a)。ドロップダウンは、他のプロパティをターゲットにしません
b)。フォームにデータが入力されたので、[インポート] ボタンも機能しなくなりました。両方のコントロール 戻る -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);
});
};