Leere Werte von JSON übergeben?

Ich benutze Github Gists, um meinen Code hier zu speichern. Wenn der Editor jedoch leer ist, kann er nicht gespeichert werden, daher verwende ich einen ternären/bedingten Operator, um zu prüfen, ob er einen Wert hat. wenn es es als einen Grund speichert und wenn es nicht zum nächsten Wert geht.Leere Werte von JSON übergeben?

Leider kam die Konsole mit
zurück Uncaught SyntaxError: Unexpected token (

Wie bin ich mit der Redaktion speichern nehme an, die einen Wert als Kern haben und diejenigen, die dies nicht tun überspringen?

Wenn jemand helfen kann, würde es sehr geschätzt werden.

$("[data-action=save]").click(function() { 
 
    data = { 
 
    "description": "sample description", 
 
    "public": true, 
 
    "files": { 
 
     (!htmlEditor.getValue()) ? "" : "index.html" : { "content": htmlEditor.getValue() }, 
 
     (!cssEditor.getValue()) ? "" : "index.css" : { "content": cssEditor.getValue() }, 
 
     (!jsEditor.getValue()) ? "" : "index.js" : { "content": jsEditor.getValue() }, 
 
     "README.md"  : { "content": "# readme sample" } 
 
    } 
 
    } 
 

 
    // Post on Github via JQuery Ajax 
 
    $.ajax({ 
 
    url: "https://api.github.com/gists", 
 
    type: "POST", 
 
    dataType: "json", 
 
    data: JSON.stringify(data) 
 
    }).success(function(e) { 
 
    $("[data-action=saved]").text(e.html_url) 
 
    $("[data-action=saved]").attr("href", e.html_url).attr("target", "_blank") 
 

 
    // Let user view gist 
 
    console.log("Your weave is saved!") 
 
    }).error(function(e) { 
 
    console.warn("Error: Could not save weave!", e) 
 
    }) 
 
}) 
 

 
var delay 
 

 
// Initialize CodeMirror editor 
 
var htmlEditor = CodeMirror.fromTextArea(document.getElementById("htmlEditor"), { 
 
    mode: "text/html", 
 
    tabMode: "indent", 
 
    styleActiveLine: true, 
 
    lineNumbers: true, 
 
    lineWrapping: true, 
 
    autoCloseTags: true, 
 
    foldGutter: true, 
 
    gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"] 
 
}) 
 
var cssEditor = CodeMirror.fromTextArea(document.getElementById("cssEditor"), { 
 
    mode: "text/css", 
 
    tabMode: "indent", 
 
    styleActiveLine: true, 
 
    lineNumbers: true, 
 
    lineWrapping: true, 
 
    autoCloseTags: true, 
 
    foldGutter: true, 
 
    gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"] 
 
}) 
 
var jsEditor = CodeMirror.fromTextArea(document.getElementById("jsEditor"), { 
 
    mode: "text/javascript", 
 
    tabMode: "indent", 
 
    styleActiveLine: true, 
 
    lineNumbers: true, 
 
    lineWrapping: true, 
 
    autoCloseTags: true, 
 
    foldGutter: true, 
 
    gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"] 
 
}) 
 

 
// Live preview 
 
function updatePreview() { 
 
    var previewFrame = document.getElementById("preview") 
 
    var preview = previewFrame.contentDocument || previewFrame.contentWindow.document 
 
    preview.open() 
 
    var htmlContent = "<st"+"yle>" + cssEditor.getValue() + "</st"+"yle>" + htmlEditor.getValue() + "<scr"+"ipt>" + jsEditor.getValue() + "</scr"+"ipt>" 
 
    preview.write(htmlContent) 
 
    preview.close() 
 
} 
 
setTimeout(updatePreview, 300) 
 

 
// Call live preview when code changes 
 
htmlEditor.on("change", function() { 
 
    clearTimeout(delay) 
 
    delay = setTimeout(updatePreview, 300) 
 
}) 
 
cssEditor.on("change", function() { 
 
    clearTimeout(delay) 
 
    delay = setTimeout(updatePreview, 300) 
 
}) 
 
jsEditor.on("change", function() { 
 
    clearTimeout(delay) 
 
    delay = setTimeout(updatePreview, 300) 
 
}) 
 

 
// Setup Grid 
 
$("#splitContainer, #leftSplitter, #rightSplitter").jqxSplitter({ theme: "metro" }) 
 
$("#splitContainer").jqxSplitter({ 
 
    height: "auto", 
 
    width: "100%", 
 
    orientation: "horizontal", 
 
    showSplitBar: true, 
 
    panels: [ 
 
    { 
 
     size: "50%", 
 
     collapsible: false 
 
    }, 
 
    { size: "50%" } 
 
    ] 
 
}) 
 
$("#leftSplitter").jqxSplitter({ 
 
    height: "100%", 
 
    width: "100%", 
 
    orientation: "vertical", 
 
    showSplitBar: true, 
 
    panels: [ 
 
    { 
 
     size: "50%", 
 
     collapsible: false 
 
    }, 
 
    { size: "50%" } 
 
    ] 
 
}) 
 
$("#rightSplitter").jqxSplitter({ 
 
    height: "100%", 
 
    width: "100%", 
 
    orientation: "vertical", 
 
    showSplitBar: true, 
 
    panels: [ 
 
    { size: "50%" }, 
 
    { 
 
     size: "50%", 
 
     collapsible: false 
 
    } 
 
    ] 
 
})

body { 
 
    overflow: hidden; 
 
} 
 

 
header { 
 
    position: absolute; 
 
    left: 0; 
 
    right: 0; 
 
    padding: 8px 5px; 
 
    overflow: hidden; 
 
} 
 

 
.fl { 
 
    float: left; 
 
} 
 

 
.fr { 
 
    float: right; 
 
} 
 

 
.save { 
 
    padding: 11px; 
 
} 
 

 
#splitContainer { 
 
    position: absolute; 
 
    top: 40px; 
 
    left: 0; 
 
    right: 0; 
 
    bottom: 0; 
 
    background: #fff; 
 
} 
 

 
.CodeMirror { 
 
    font-family: monospace; 
 
    font-size: 14px; 
 
    font-weight: normal; 
 
    display: block; 
 
    width: 100%; 
 
    background: transparent; 
 
    height: 100% !important; 
 
} 
 

 
.CodeMirror-gutters { 
 
    height: 100% !important; 
 
} 
 

 
.lint-error { 
 
    font-family: arial; 
 
    font-size: 70%; 
 
    background: #ffa; 
 
    color: #a00; 
 
    padding: 2px 5px 3px; 
 
} 
 

 
.lint-error-icon { 
 
    color: white; 
 
    background-color: red; 
 
    font-weight: bold; 
 
    border-radius: 50%; 
 
    padding: 0 3px; 
 
    margin-right: 7px; 
 
} 
 

 
.editor-container { 
 
    width: 100%; 
 
    height: 100%; 
 
    background: #fff; 
 
} 
 
.editor-container > * { 
 
    width: 100%; 
 
    height: 100%; 
 
    border: 0; 
 
    outline: 0; 
 
    padding: 0; 
 
    margin: 0; 
 
    background: transparent; 
 
    resize: none; 
 
} 
 

 
iframe { 
 
    width: 100%; 
 
    height: 100%; 
 
    border: 0; 
 
}

<link rel="stylesheet" href="https://necolas.github.io/normalize.css/4.0.0/normalize.css"> 
 
<link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css"> 
 
<link rel="stylesheet" href="http://codemirror.net/addon/fold/foldgutter.css"> 
 
<link rel="stylesheet" href="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/styles/jqx.base.css"> 
 
<link rel="stylesheet" href="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/styles/jqx.metro.css"> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://codemirror.net/lib/codemirror.js"></script> 
 
<script src="http://codemirror.net/mode/javascript/javascript.js"></script> 
 
<script src="http://codemirror.net/mode/xml/xml.js"></script> 
 
<script src="http://codemirror.net/mode/css/css.js"></script> 
 
<script src="http://codemirror.net/mode/htmlmixed/htmlmixed.js"></script> 
 
<script src="http://codemirror.net/addon/edit/closetag.js"></script> 
 
<script src="http://codemirror.net/addon/edit/matchbrackets.js"></script> 
 
<script src="http://codemirror.net/addon/selection/active-line.js"></script> 
 
<script src="http://codemirror.net/addon/fold/foldcode.js"></script> 
 
<script src="http://codemirror.net/addon/fold/foldgutter.js"></script> 
 
<script src="http://codemirror.net/addon/fold/brace-fold.js"></script> 
 
<script src="http://codemirror.net/addon/fold/xml-fold.js"></script> 
 
<script src="http://codemirror.net/addon/fold/comment-fold.js"></script> 
 
<script src="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqxcore.js"></script> 
 
<script src="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqxsplitter.js"></script> 
 

 
<header> 
 
    <a href="javascript:void(0)" data-action="save" class="save">save</a> 
 
    <a data-action="saved"></a> 
 
</header> 
 
<form class="fill"> 
 
    <div id="splitContainer"> 
 
    <div> 
 
     <div id="leftSplitter"> 
 
     <div> 
 
      <textarea id="htmlEditor"><!-- sample html --></textarea> 
 
     </div> 
 
     <div> 
 
      <textarea id="cssEditor"></textarea> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    <div> 
 
     <div id="rightSplitter"> 
 
     <div> 
 
      <textarea id="jsEditor">// sample js</textarea> 
 
     </div> 
 
     <div> 
 
      <iframe id="preview" sandbox="allow-same-origin allow-scripts allow-popups allow-forms"></iframe> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</form>

Quelle

2016-03-30 Michael Schwartz

diese Bedingung scheint ungültig zu sein '(! HtmlEditor.getValue())? "": "index.html": {"Inhalt": htmlEditor.getValue()}, (! cssEditor.getValue())? "": "index.css": {"Inhalt": cssEditor.getValue()}, (! jsEditor.getValue())? "": "index.js": {"content": jsEditor.getValue()}, ' – itzmukeshy7

Hier ist, was ich getan habe!

Ich lege alles in einen JSON; überprüfte, ob es einen Wert hatte, wenn ich es als eine zu speichernde Datei einstellte, und wenn es keinen Wert hatte, würde die Datei nicht existieren, also nicht gespeichert werden.

$("[data-action=save]").click(function() { 
 
    var files = {} 
 
    if (htmlEditor.getValue()) { 
 
    files["index.html"] = htmlEditor.getValue() ? { content: htmlEditor.getValue() } : null 
 
    } 
 
    if (cssEditor.getValue()) { 
 
    files["index.css"] = cssEditor.getValue() ? { content: cssEditor.getValue() } : null 
 
    } 
 
    if (jsEditor.getValue()) { 
 
    files["index.js"] = jsEditor.getValue() ? { content: jsEditor.getValue() } : null 
 
    } 
 

 
    data = { 
 
    "description": "sample description", 
 
    "public": true, 
 
    "files": files 
 
    } 
 

 
    // Post on Github via JQuery Ajax 
 
    $.ajax({ 
 
    url: "https://api.github.com/gists", 
 
    type: "POST", 
 
    dataType: "json", 
 
    data: JSON.stringify(data) 
 
    }).success(function(e) { 
 
    $("[data-action=saved]").text(e.html_url) 
 
    $("[data-action=saved]").attr("href", e.html_url).attr("target", "_blank") 
 

 
    // Let user view gist 
 
    console.log("Your weave is saved!") 
 
    }).error(function(e) { 
 
    console.warn("Error: Could not save weave!", e) 
 
    }) 
 
}) 
 

 
var delay 
 

 
// Initialize CodeMirror editor 
 
var htmlEditor = CodeMirror.fromTextArea(document.getElementById("htmlEditor"), { 
 
    mode: "text/html", 
 
    tabMode: "indent", 
 
    styleActiveLine: true, 
 
    lineNumbers: true, 
 
    lineWrapping: true, 
 
    autoCloseTags: true, 
 
    foldGutter: true, 
 
    gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"] 
 
}) 
 
var cssEditor = CodeMirror.fromTextArea(document.getElementById("cssEditor"), { 
 
    mode: "text/css", 
 
    tabMode: "indent", 
 
    styleActiveLine: true, 
 
    lineNumbers: true, 
 
    lineWrapping: true, 
 
    autoCloseTags: true, 
 
    foldGutter: true, 
 
    gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"] 
 
}) 
 
var jsEditor = CodeMirror.fromTextArea(document.getElementById("jsEditor"), { 
 
    mode: "text/javascript", 
 
    tabMode: "indent", 
 
    styleActiveLine: true, 
 
    lineNumbers: true, 
 
    lineWrapping: true, 
 
    autoCloseTags: true, 
 
    foldGutter: true, 
 
    gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"] 
 
}) 
 

 
// Live preview 
 
function updatePreview() { 
 
    var previewFrame = document.getElementById("preview") 
 
    var preview = previewFrame.contentDocument || previewFrame.contentWindow.document 
 
    preview.open() 
 
    var htmlContent = "<st"+"yle>" + cssEditor.getValue() + "</st"+"yle>" + htmlEditor.getValue() + "<scr"+"ipt>" + jsEditor.getValue() + "</scr"+"ipt>" 
 
    preview.write(htmlContent) 
 
    preview.close() 
 
} 
 
setTimeout(updatePreview, 300) 
 

 
// Call live preview when code changes 
 
htmlEditor.on("change", function() { 
 
    clearTimeout(delay) 
 
    delay = setTimeout(updatePreview, 300) 
 
}) 
 
cssEditor.on("change", function() { 
 
    clearTimeout(delay) 
 
    delay = setTimeout(updatePreview, 300) 
 
}) 
 
jsEditor.on("change", function() { 
 
    clearTimeout(delay) 
 
    delay = setTimeout(updatePreview, 300) 
 
}) 
 

 
// Setup Grid 
 
$("#splitContainer, #leftSplitter, #rightSplitter").jqxSplitter({ theme: "metro" }) 
 
$("#splitContainer").jqxSplitter({ 
 
    height: "auto", 
 
    width: "100%", 
 
    orientation: "horizontal", 
 
    showSplitBar: true, 
 
    panels: [ 
 
    { 
 
     size: "50%", 
 
     collapsible: false 
 
    }, 
 
    { size: "50%" } 
 
    ] 
 
}) 
 
$("#leftSplitter").jqxSplitter({ 
 
    height: "100%", 
 
    width: "100%", 
 
    orientation: "vertical", 
 
    showSplitBar: true, 
 
    panels: [ 
 
    { 
 
     size: "50%", 
 
     collapsible: false 
 
    }, 
 
    { size: "50%" } 
 
    ] 
 
}) 
 
$("#rightSplitter").jqxSplitter({ 
 
    height: "100%", 
 
    width: "100%", 
 
    orientation: "vertical", 
 
    showSplitBar: true, 
 
    panels: [ 
 
    { size: "50%" }, 
 
    { 
 
     size: "50%", 
 
     collapsible: false 
 
    } 
 
    ] 
 
})

body { 
 
    overflow: hidden; 
 
} 
 

 
header { 
 
    position: absolute; 
 
    left: 0; 
 
    right: 0; 
 
    padding: 8px 5px; 
 
    overflow: hidden; 
 
} 
 

 
.fl { 
 
    float: left; 
 
} 
 

 
.fr { 
 
    float: right; 
 
} 
 

 
.save { 
 
    padding: 11px; 
 
} 
 

 
#splitContainer { 
 
    position: absolute; 
 
    top: 40px; 
 
    left: 0; 
 
    right: 0; 
 
    bottom: 0; 
 
    background: #fff; 
 
} 
 

 
.CodeMirror { 
 
    font-family: monospace; 
 
    font-size: 14px; 
 
    font-weight: normal; 
 
    display: block; 
 
    width: 100%; 
 
    background: transparent; 
 
    height: 100% !important; 
 
} 
 

 
.CodeMirror-gutters { 
 
    height: 100% !important; 
 
} 
 

 
.lint-error { 
 
    font-family: arial; 
 
    font-size: 70%; 
 
    background: #ffa; 
 
    color: #a00; 
 
    padding: 2px 5px 3px; 
 
} 
 

 
.lint-error-icon { 
 
    color: white; 
 
    background-color: red; 
 
    font-weight: bold; 
 
    border-radius: 50%; 
 
    padding: 0 3px; 
 
    margin-right: 7px; 
 
} 
 

 
.editor-container { 
 
    width: 100%; 
 
    height: 100%; 
 
    background: #fff; 
 
} 
 
.editor-container > * { 
 
    width: 100%; 
 
    height: 100%; 
 
    border: 0; 
 
    outline: 0; 
 
    padding: 0; 
 
    margin: 0; 
 
    background: transparent; 
 
    resize: none; 
 
} 
 

 
iframe { 
 
    width: 100%; 
 
    height: 100%; 
 
    border: 0; 
 
}

<link rel="stylesheet" href="https://necolas.github.io/normalize.css/4.0.0/normalize.css"> 
 
<link rel="stylesheet" href="http://codemirror.net/lib/codemirror.css"> 
 
<link rel="stylesheet" href="http://codemirror.net/addon/fold/foldgutter.css"> 
 
<link rel="stylesheet" href="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/styles/jqx.base.css"> 
 
<link rel="stylesheet" href="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/styles/jqx.metro.css"> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://codemirror.net/lib/codemirror.js"></script> 
 
<script src="http://codemirror.net/mode/javascript/javascript.js"></script> 
 
<script src="http://codemirror.net/mode/xml/xml.js"></script> 
 
<script src="http://codemirror.net/mode/css/css.js"></script> 
 
<script src="http://codemirror.net/mode/htmlmixed/htmlmixed.js"></script> 
 
<script src="http://codemirror.net/addon/edit/closetag.js"></script> 
 
<script src="http://codemirror.net/addon/edit/matchbrackets.js"></script> 
 
<script src="http://codemirror.net/addon/selection/active-line.js"></script> 
 
<script src="http://codemirror.net/addon/fold/foldcode.js"></script> 
 
<script src="http://codemirror.net/addon/fold/foldgutter.js"></script> 
 
<script src="http://codemirror.net/addon/fold/brace-fold.js"></script> 
 
<script src="http://codemirror.net/addon/fold/xml-fold.js"></script> 
 
<script src="http://codemirror.net/addon/fold/comment-fold.js"></script> 
 
<script src="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqxcore.js"></script> 
 
<script src="http://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqxsplitter.js"></script> 
 

 
<header> 
 
    <a href="javascript:void(0)" data-action="save" class="save">save</a> 
 
    <a data-action="saved"></a> 
 
</header> 
 
<form class="fill"> 
 
    <div id="splitContainer"> 
 
    <div> 
 
     <div id="leftSplitter"> 
 
     <div> 
 
      <textarea id="htmlEditor"><!-- sample html --></textarea> 
 
     </div> 
 
     <div> 
 
      <textarea id="cssEditor"></textarea> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    <div> 
 
     <div id="rightSplitter"> 
 
     <div> 
 
      <textarea id="jsEditor">// sample js</textarea> 
 
     </div> 
 
     <div> 
 
      <iframe id="preview" sandbox="allow-same-origin allow-scripts allow-popups allow-forms"></iframe> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</form>

Quelle

2016-03-30 07:03:24

-1

In ternären Operator Bedingungen vergleichen es gegen undefinierte statt!

Quelle

2016-03-30 03:41:04

Ich bin. '! $ (selector) .val()' ist eine andere Art, '$ (selector) .val() ==" "' zu schreiben –

Leere Werte von JSON übergeben?

Antwort

Verwandte Themen