Owen Parsons
Owen Parsons

Reputation: 71

Return HTML code in javascript?

I'm fairly new to javascript and I'm wondering how I could get this piece of code (part of a bigger whole) to do what I want. I'd like to add HTML to the prhases 'articles in shopping cart' and 'article in shopping cart'. Is this possible? Many thanks.

I don't mean styling (bold or italic), this is what i'd want it to return:

return quantity + (quantity == 1 ? ' 
  article in shopping cart <span class="simpleCart_quantity"></span>- 
 <span class="simpleCart_total"></span>
 <a href="shoppingcart.html">Show</a>' : 
 ' articles in shopping  cart 
  <span class="simpleCart_quantity"></span>-
  <span class="simpleCart_total"></span>
  <a href="shoppingcart.html">Show</a>');

I know this is not possible, how is it possible?

quantity: function () {
    var quantity = 0;
    simpleCart.each(function (item) {
        quantity += item.quantity();
    });
    if (quantity == 0) {
        return 'Your shopping cart is empty';
    } else {
        return quantity + (quantity == 1 ? ' article in shopping cart' : ' articles in shopping cart');
    }
},

Upvotes: 4

Views: 51554

Answers (1)

nnnnnn
nnnnnn

Reputation: 150070

Of course it's possible, although whether whatever calls that function does something sensible with the result is another matter.

Anyway, just include the desired html in the strings as required:

return quantity + (quantity == 1 ? ' article <span class="x">in shopping cart</span>' :
                                   ' articles <i>in</i> shopping cart');

EDIT: the example that you added to the question doesn't work because it has syntax errors - your string literal contains newlines. Make it a valid string and it will work, either by putting each string all on one line or by concatenating individual strings:

return quantity + (quantity == 1 ?  
  'article in shopping cart <span class="simpleCart_quantity"></span>- <span class="simpleCart_total"></span> <a href="shoppingcart.html">Show</a>' : 
  'articles in shopping  cart <span class="simpleCart_quantity"></span>- <span class="simpleCart_total"></span> <a href="shoppingcart.html">Show</a>');

If the only difference between the strings you are using is whether "article" has an "s" on the end then try this:

return quantity + (quantity == 1 ? 'article' : 'articles') +
       ' in shopping cart <span class="simpleCart_quantity"></span>- <span class="simpleCart_total"></span> <a href="shoppingcart.html">Show</a>';

Upvotes: 3

Related Questions