2016-01-01 2 views
0

Мне нужно отобразить сопутствующие товары в javascript на листе eBay. У меня есть эта идея: я храню информацию о других списках, таких как: url, изображение, цена и метки, прикрепленные к этому продукту.Показать похожие продукты в javascript

пример:

some_product = [ 
    tags: 'home, garden, kitchen', 
    url: http://listing.url, 
    price: 100 
], 
some_product_2 = [ 
    tags: 'home, lifestyle, books', 
    url: http://listing2.url, 
    price: 120 
] 

и листинга я ставлю такой код:

<script type="text/javascript" src="http://domain.com/related_prod.js?keyword=home"></script> 

, и я надеюсь, что показал все продукты с "дома" в "тегов". Может ли кто-нибудь направить меня к решению?

+0

Это не работает JavaScript. –

+0

Я не уверен, что я действительно понял, что вы пытаетесь сделать, но в любом случае это немного пахнет работой для файла 'JSON', используемого с помощью AJAX'. – MorKadosh

ответ

1

Во-первых, это не является допустимым JavaScript или JSON:

some_product = [ 
    tags: 'home, garden, kitchen', 
    url: http://listing.url, 
    price: 100 
], 
    some_product_2 = [ 
    tags: 'home, lifestyle, books', 
    url: http://listing2.url, 
    price: 120 
] 

выше должен быть заменен { } для объектов.

{ 
    some_product: { 
     tags: 'home, garden, kitchen', 
     url: http://listing.url, 
     price: 100 
    }, 
     some_product_2: { 
     tags: 'home, lifestyle, books', 
     url: http://listing2.url, 
     price: 120 
    } 
} 

Вышеупомянутый объект JavaScript сейчас. Но это стало лучше. Теперь, будучи чистым JSON, он должен быть добавлен в переменную JavaScript. Рассмотрим это:

var products = { 
    some_product: { 
     tags: 'home, garden, kitchen', 
     url: http://listing.url, 
     price: 100 
    }, 
     some_product_2: { 
     tags: 'home, lifestyle, books', 
     url: http://listing2.url, 
     price: 120 
    } 
} 

Теперь с помощью products, вы можете петлю и поместить его в качестве элемента списка.

var products = { 
 
    some_product: { 
 
    tags: 'home, garden, kitchen', 
 
    url: 'http://listing.url', 
 
    price: 100 
 
    }, 
 
    some_product_2: { 
 
    tags: 'home, lifestyle, books', 
 
    url: 'http://listing2.url', 
 
    price: 120 
 
    } 
 
} 
 
var finalHtml = ""; 
 
for (var item in products) { 
 
    finalHtml += '<li><a href="' + products[item].url + '">' + item + '<\/a> <br \/>Tags: ' + products[item].tags + '<br \/>Price: ' + products[item].price + ' $</li>'; 
 
} 
 
document.getElementById("products").innerHTML = finalHtml;
<ul id="products"></ul>

См фрагмент выше.

+1

Я знаю, это был всего лишь эскиз. Я надеюсь, что все поняли :) Но это отображение всех продуктов, а не тегов с тегом. – user3041764

1

Учитывая, что это не правильный JavaScript, мы можем перестроить свой код на что-то более полезное для сценария ... Как это:

var products = [ 
    { 
    name: 'some_product', 
    tags: ['home', 'garden', 'kitchen'], 
    url: 'http://example.com/1', 
    price: 100, 
    }, 

    { 
    name: 'some_product_2', 
    tags: ['home', 'lifestyle', 'books'], 
    url: 'http://example.com/2', 
    price: 120, 
    } 
]; 

Отсюда, мы можем использовать Array.prototype.filter принести результаты, основанные на tags:

function category(tag) { 
    return products.filter(function(product){ 
    if (~product.tags.indexOf(tag)) return product; 
    }); 
} 

category('home'); 
// ... 

Example

0

как Praveen Кумар и Jamen оказались полезными. Я присоединился к их ответам, чтобы создать один код.

var products = [ 
 
    { 
 
    name: 'some_product', 
 
    tags: ['home', 'garden', 'kitchen'], 
 
    url: 'http://example.com/1', 
 
    price: 100, 
 
    }, 
 

 
    { 
 
    name: 'some_product_2', 
 
    tags: ['home', 'lifestyle', 'books'], 
 
    url: 'http://example.com/2', 
 
    price: 120, 
 
    }, 
 

 
    { 
 
    name: 'some_product_3', 
 
    tags: ['garden', 'lifestyle', 'books'], 
 
    url: 'http://example.com/2', 
 
    price: 120, 
 
    } 
 
]; 
 

 
var finalHtml = ""; 
 

 
function category(tag) { 
 
    return products.filter(function(product){ 
 
    if (~product.tags.indexOf(tag)) { 
 
    \t finalHtml += '<li><a href="' + product.url + '">' + product.name + '<\/a><br \/>Price: ' + product.price + ' $</li>'; 
 
     document.getElementById("products").innerHTML = finalHtml; 
 
    \t console.log(product.name); 
 
    } 
 
    }); 
 
} 
 
category('home'); 
 
//category('garden');
<ul id="products"></ul>

https://jsfiddle.net/p5x2v2cb/

Спасибо за ответы.

Смежные вопросы