jQuery - Show variable, not text string

Question

I have a variable being set as the .html(); of a <div />

The variable is the name of another variable. I want it to display the contents of the other variable, however it simply displays the name of the other variable.

How can I force it to show the variable contents rather than just a literal text string?

var clothing = 'dogeshop cryptoshop doge_clothing fyrstikken the_molly_machine peace_and_love moolah_market shibe_swag undieguys urban_graff kravshop got_doge mean_elephant the_dogedoor_store';


setInterval( function() {
    var term = $("input").val();
    $("#results").html(term);
}, 100);

When the user types 'clothing' into $("input"); the contents of the 'clothing' variable should be displayed in the $("#results"); <div />. Instead it just says 'clothing'.

I don't think this is the right mechanism. Why not use an associative array instead of a variable? So you'd look up the string `'clothing'` (obtained from `$("input").val()`) and retrieve `'dogeshop cryptoshop...'`? — lurker, Feb 21 '14 at 21:28

score 1 · Answer 1 · edited May 23 '17 at 10:26

1

The only way I know how to solve this is using eval:

$("#results").html(eval(term))

But you really shouldn't want to do that. :)

edited May 23 '17 at 10:26

Community

1
1

answered Feb 21 '14 at 21:38

rla4

1,228
13
25

3

@rla4, @william44isme using `eval()` on a user input is a big security issue!! – Skwal Feb 21 '14 at 21:40
Just edited my answer and added a link explaining why not. Just keep in mind that it has many pitfalls and use it wisely – rla4 Feb 21 '14 at 21:41

score 1 · Accepted Answer · answered Feb 21 '14 at 21:38

Another way is to use object properties, like this

var obj = {};
obj.clothing = 'dogeshop cryptoshop doge_clothing fyrstikken the_molly_machine peace_and_love moolah_market shibe_swag undieguys urban_graff kravshop got_doge mean_elephant the_dogedoor_store';


setInterval( function() {
    var term = $("input").val();
    $("#results").html(obj[term]);
}, 100);

Here's the fiddle: http://jsfiddle.net/ZL7EQ/

score 1 · Answer 3 · answered Feb 21 '14 at 21:40

1

Use a dictionary.

// store strings in an object so you can look them up by key
var dict = {
    clothing: 'dogeshop ...',
    anotherKey: '...'
};

// update the result when the input changes
$('input').on('change', function() {
    var result = dict[this.value]; // make sure the key exists

    if (result) {
        $('#results').val(result); // update the results
    }
});

answered Feb 21 '14 at 21:40

Evan Davis

35,493
6
50
57

Wow! This is fantastic, thanks for optimising the code by removing that interval too. – william44isme Feb 21 '14 at 21:43

score 0 · Answer 4 · edited Feb 21 '14 at 21:35

0

I use to make this mistake myself when working with jQuery.

Try instead:

 $("#results").text(term);

Not sure what you have the interval for. You could just change the #results with a change event.

edited Feb 21 '14 at 21:35

War10ck

12,387
7
41
54

answered Feb 21 '14 at 21:31

alexmac

239
2
9

results.text not html :) – alexmac Feb 21 '14 at 21:36
Yeah I tried that but it still doesn't seem to work. [jsFiddle](http://jsfiddle.net/LyQqg/) – william44isme Feb 21 '14 at 21:38
See http://www.w3schools.com/jquery/jquery_dom_set.asp , it shows the why and how. I know it works for the code, I took it from my own work. Let me try what you have there. And Also your interval event , look to the next answer for the ON event – alexmac Feb 21 '14 at 21:40
1

@alexmac you are misinterpreting the problem. It's not about setting the contents of the `div`; the issue is that the string _clothing_ is being printed instead of the __contents of the variable `clothing`__. – Evan Davis Feb 21 '14 at 21:41

jQuery - Show variable, not text string

4 Answers4