1

HTML5 / JS / jQuery / CSSを使用して、カスタマイズされた基本的なSVGエディターを作成する必要があります。
エディターへの入力は、2つのファイルx.svgとそれに関連するx.cssファイルです。

x.svgは、x.cssのスタイルが適用された状態でHTMLページに読み込まれます。次に、ストローク、幅などのスタイルは、JS/jQueryを使用して操作されます。これまでのところすべて問題ありません。

私の問題は、ユーザーがスタイルにいくつかの変更を加え、それらの変更をx.cssファイルに永続的に保存したい場合、その方法がわからないことです。属性と値のペアをファイルに簡単に書き込むことができますが、 x.cssファイルにはセレクターや中括弧などがあります...プログラムの出力はプローバーx.cssファイルである必要があります。x.svgは同じままであることに注意してください。この問題をどのように処理できますか。コードなしの詳細なアイデアで十分です。

4

2 に答える 2

1

これが答えです。私は Eli gray の FileSaver.min.js と BlobBuilder.min.js の助けを借りてそれを達成しました。関数はアンカー要素のクリック イベントに関連付けられており、ユーザーがクリックするとダイアログが表示され、尋ねられます。ファイル名と保存場所を挿入します。Chrome 23 でテストしましたが、バージョン 24 では機能しませんでした。

function exportCSS() 
{

//stop anchor link from taking us anywhere
event.preventDefault();
//index is chosen for test sofar, need next to iterate over all sSheets and pick the right one depending on svg file name
sSheet = document.styleSheets[2];
myRules = sSheet.cssRules;
len = myRules.length;
for (i = 0; i < 50; i++) {
    cssOutputString = cssOutputString + myRules[i].cssText + "\n";
}
console.log(cssOutputString);

//save the file
var blob = new Blob([cssOutputString]);

saveAs(blob, "file.css");
}
于 2013-01-16T13:20:15.183 に答える
0

セキュリティ上の理由から、Javascriptを使用してクライアントのハードドライブにファイルを保存することはできません。

于 2012-12-04T16:31:55.257 に答える