javascript - string replacer and json -


i'm working in app replace strings other strings inside string.

example: "nuggets" replaces "chicken" input = "i chicken"; output = "i nuggets";

for have textarea input. user input json object this.

example: replacing_box_input = "{"a":"b","b":"c","c":"d","chicken":"nuggets"}"; input = "i chicken abc"; output = "i nuggets bcd";

here code using:

var output = $("#output");    string.prototype.cap = function () {    return this.charat(0).touppercase() + this.slice(1);  };    function trans() {    var dic_editor = $("#dic-editor");    var value = dic_editor.val();    var mapobj = json.parse(value);      var re = new regexp(object.keys(mapobj).sort(function(a, b) {      return b.length - a.length;    }).join("|"), "g");      value = value.replace(re, function (matched) {      return mapobj[matched];    });      output.val(value);  }
body {    background-color: #cccccc;    color: #444444;  }    h1 {    text-align: center;    font-family: "courier";  }    #explanation {    text-align: justify;    font-family: "times new roman";    font-size: 1em;    text-indent: 3em;  }    code {    font-family: "courier new";    font-size: .8em;    padding: 2px;    padding-left: 4px;    padding-right: 4px;    background-color: #111111;    color: #aaaaaa;    border-radius: 2px;  }    #dic-editor {    width: calc(100% - .86%);    width: -moz-calc(100% - .86%);    height: calc(100vh - 1.86em);    height: -moz-calc(100vh - 1.86em);    padding: .43%;    margin: 0;    margin-bottom: 1em;    border: none;    background-color: #111111;    color: #aaaaaa;    border-radius: 2px;    font-size: 1em;    outline: none;    resize: none;    overflow: auto;  }    #input {    width: calc(43% - .86%);    width: -moz-calc(43% - .86%);    height: 40vh;    float: left;    padding: .43%;    margin: 0;    border: none;    background-color: #111111;    color: #aaaaaa;    border-radius: 2px;    font-size: 1em;    outline: none;    resize: none;    overflow: auto;  }    #inputb {    font-family: "courier";    width: 14%;    padding: 0;    margin: 0;    padding-top: 3px;    padding-bottom: 3px;    border: none;    background-color: #1f1f1f;    color: #aaaaaa;    border-radius: 2px;    font-size: .8em;    resize: none;    cursor: pointer;    outline: none;  }    #inputb:hover {    background-color: #aaaaaa;    color: #1f1f1f;  }    #output {    width: calc(43% - .86%);    width: -moz-calc(43% - .86%);    height: 40vh;    float: right;    padding: .43%;    margin: 0;    border: none;    background-color: #111111;    color: #aaaaaa;    border-radius: 2px;    font-size: 1em;    outline: none;    resize: none;    overflow: auto;  }
<!doctype html>  <html lang="en-us">    <head>      <title>conlango</title>    </head>    <body>      <h1>conlang: generator</h1>            <textarea id="dic-editor"></textarea>            <div id="translator">        <textarea id="input"></textarea>        <input type="button" value="translate" id="inputb" onclick="trans()">        <textarea id="output" readonly></textarea>      </div>    </body>    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  </html>

the code not replacing should. need figuring out. of know why not replacing strings should?

here working example without being hooked user interface:

string.prototype.cap = function () {   return this.charat(0).touppercase() + this.slice(1); };  function trans(value, jsonmap) {   var mapobj = json.parse(jsonmap);    var re = new regexp(object.keys(mapobj).sort(function(a, b) {     return b.length - a.length;   }).join("|"), "g");    return value.replace(re, function (matched) {     return mapobj[matched];   }); }  console.log(trans('i chicken abc', '{"a":"b","b":"c","c":"d","chicken":"nuggets"}')); 

the output when run is:

i nuggets bcd

jsfiddle: http://jsfiddle.net/q80k9z2w/

and here hooked ui: http://jsfiddle.net/d1rsof1q/2/


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -