0

I have got a few divs with numbers from 0 to 3200 and want to replace them with a character.

example of html:

  <div>2</div>
  <div>6</div>
  <div>26</div>

example of jQuery:

   $('div').text(function () {
                return $(this).text().replace("1","K").replace("2","/").replace("3","@").replace("4","r").replace("5","[").replace("6","[").replace("7","[").replace("8",",").replace("9",",").replace("10","J").replace("11",",").replace("12",",").replace("13","P").replace("14","]").replace("15","]").replace("16","]").replace("17","R").replace("18","R").replace("19","N").replace("20","N").replace("21","N").replace("22","N").replace("23","W").replace("24","L").replace("25","d").replace("26","D").replace("27","(").replace("28","B").replace("29","b").replace("30","B").replace("31","a").replace("32","A").replace("33","f").replace("34","F").replace("35","[").replace("36",":").replace("37","@").replace("38","@").replace("39","!").replace("40","?").replace("41","Z").replace("42","]").replace("43","Z").replace("44","B").replace("45","@").replace("46","]").replace("47","@").replace("0","V").replace("3200","c");
            });

What I have got for 2 - / correct, for 6 - [ correct, and for 26 - /[ wrong for 26 should be D.

Can you please help me with my jQuery code please? Live jsFiddle here: http://jsfiddle.net/UEy7w/

1
  • what u want can u explain it clearly
    – I'm Geeker
    Feb 12, 2014 at 7:49

6 Answers 6

1

I'd suggest the approach:

var charMap = {
    '1' : 'K',
    '2' : '/',
    '3' : '@',
    '4' : 'r',
    '6' : '[',
    '26' : 'D'
    // please fill in the rest yourself
};

$('div').text(function (i,t) {
    return charMap[t] || t;
});

JS Fiddle demo.

This approach avoids the 2 and 6 of 26 being assessed separately by passing the whole of the existing text t of the element as a key to the charMap object and returning the relevant character or, if one doesn't exist for that text, returning the old text itself.

References:

2
  • Hi David, your approach is amazing. Thank you.
    – qqruza
    Feb 12, 2014 at 8:03
  • You're very welcome; I'm glad to have been of help! :) Feb 13, 2014 at 17:59
1

You should replace 26 before you replace 2.. else the 2 of 26 will allready be replaced

0

The replace function are executed in the order left to right. So, before your code for replacing a 26 gets called, the 2 and the 6 have already been replaced.

Solution: Reorder the calls to .replace(), ensuring that the none in the chain will break any future (= further to the right) replacement.

Better solution: Whatever you are doing, don't do it - it looks like it's built to fail.

0

26 is getting replaced by 2 and 6 respectively. Place single digit replace code after two digit replace code.try this:

    $('div').text(function () {
                return $(this).text().replace("10","J").replace("11",",").replace("12",",").replace("13","P").replace("14","]").replace("15","]").replace("16","]").replace("17","R").replace("18","R").replace("19","N").replace("20","N").replace("21","N").replace("22","N").replace("23","W").replace("24","L").replace("25","d").replace("26","D").replace("27","(").replace("28","B").replace("29","b").replace("30","B").replace("31","a").replace("32","A").replace("33","f").replace("34","F").replace("35","[").replace("36",":").replace("37","@").replace("38","@").replace("39","!").replace("40","?").replace("41","Z").replace("42","]").replace("43","Z").replace("44","B").replace("45","@").replace("46","]").replace("47","@").replace("0","V").replace("3200","c").replace("1","K").replace("2","/").replace("3","@").replace("4","r").replace("5","[").replace("6","[").replace("7","[").replace("8",",").replace("9",",");
            });

Demo

3
  • And now the single 2 isn't being replaced at all. You just broke the replacement of the 2.
    – Cerbrus
    Feb 12, 2014 at 7:54
  • Did not kept that in mind.Thanks cebrus updated now. Feb 12, 2014 at 7:58
  • Now you're just doing exactly what I did, except you forgot about the 3200.
    – Cerbrus
    Feb 12, 2014 at 8:00
0

First, replace the longest numbers, like 26. Then, replace 2. That way, the 2 in 26 won't be replaced before you can "recognize" the 26.

This should do the trick:

$('div').text(function () {
    return $(this).text()
        .replace("3200","c")
        .replace("10","J")
        .replace("11",",")
        .replace("12",",")
        .replace("13","P")
        .replace("14","]")
        .replace("15","]")
        .replace("16","]")
        .replace("17","R")
        .replace("18","R")
        .replace("19","N")
        .replace("20","N")
        .replace("21","N")
        .replace("22","N")
        .replace("23","W")
        .replace("24","L")
        .replace("25","d")
        .replace("26","D")
        .replace("27","(")
        .replace("28","B")
        .replace("29","b")
        .replace("30","B")
        .replace("31","a")
        .replace("32","A")
        .replace("33","f")
        .replace("34","F")
        .replace("35","[")
        .replace("36",":")
        .replace("37","@")
        .replace("38","@")
        .replace("39","!")
        .replace("40","?")
        .replace("41","Z")
        .replace("42","]")
        .replace("43","Z")
        .replace("44","B")
        .replace("45","@")
        .replace("46","]")
        .replace("47","@")
        .replace("0","V")
        .replace("1","K")
        .replace("2","/")
        .replace("3","@")
        .replace("4","r")
        .replace("5","[")
        .replace("6","[")
        .replace("7","[")
        .replace("8",",")
        .replace("9",",");
});
1
  • No problem, @qqruza. Please consider accepting this answer, but also have a look at what David Thomas posted, as it's a more elegant solution.
    – Cerbrus
    Feb 12, 2014 at 8:05
0

This is because you are calling .replace() recursively on an already replaced text.

This is how your code works now.

"26".replace(2,'\')
"\6".replace((6,'[')

If you put your .replace('26',D) ahead of all other replace it will work as expected.

Here is the fiddle : http://jsfiddle.net/bEqwP/1/

But this is not how you should proceed. I said this just to make you understand what is happening behind the scene. I would suggest the approach mentioned by David Thomas

1
  • I have done it in my jsFiddle but it doesn't seem working ;-(
    – qqruza
    Feb 12, 2014 at 7:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.