I am pulling data with $.getJSON
and displaying it in a div. I thought I would have another json query to get one product but I don't so I was wondering of there is anyway to query the results or just grab a few variables to pass? I need to pass one record to another page. I found this on this site:
var people = json.filter(function(el)
{
return el.Phoneno.some(function(number)
{
return number.Cell == "777-777开发者_运维百科-7777";
});
});
Seems like I need to pull the entire query again though and parse through it. Is there away to just pass a few variables to another page? Very new to jQuery, if someone could point me it right direction that would be great, thanks for any help!
UPDATE:
$.getJSON("myurl", function(data){
$.each(data.myproducts, function(i,item){
$("#products").append("<li><a href='"+item.Url+"' target='_top'><img src='"+item.image+"'></a>"
+"<br>"+item.Name+"<br>"+"$"+item.saleprice+"</li>");
});
});
You can pass a JavaScript object:
var data = {
url: 'http://example.com',
image: 'http://placekitten.com/200/300',
name: 'can haz cheezburger?'
};
through a URL query parameter by serializing it to JSON:
var strData = JSON.stringify(data);
// '{"url":"http://example.com","image":"http://placekitten.com/200/300","name":"can haz cheezburger?"}'
and then URL-encoding it:
var encodedStrData = encodeURIComponent(strData);
// '%7B%22url%22%3A%22http%3A%2F%2Fexample.com%22%2C%22image%22%3A%22http%3A%2F%2Fplacekitten.com%2F200%2F300%22%2C%22name%22%3A%22can%20haz%20cheezburger%3F%22%7D'
and then adding it to the query string of a URL. If you have an anchor like this:
<a id="next" href="next/page">Next Page</a>
you can modify it with jQuery like this:
var $next = $('#next'),
url = $next.prop('href') + '?data=' + encodedStrData;
$next.prop('href', url);
The receiving page will then have to unpack the data in the URL, if present.
...or you could just pass some sort of item ID:
<a href="next/page?item=42">Next Page</a>
Edit
Try this, which uses $.param(...)
instead of encodeURIComponent(JSON.stringify(...))
:
$.getJSON("myurl", function(data)
{
$.each(data.myproducts, function(i,item)
{
var url = 'details.html?' + $.param({data: item});
$("#products").append("<li><a href='"+url+"' target='_top'><img src='"+item.image+"'></a>"
+"<br>"+item.Name+"<br>"+"$"+item.saleprice+"</li>");
});
});
This can definitely be cleaned up, but I've left it as similar to the original code as possible for clarity. CodeReview.SE is a great resource for improving correct code.
Then, on the receiving page, you need to grab the value of the data
parameter. I recommend using jQuery BBQ for that:
$(function ()
{
var item = $.deparam.querystring().data;
// Item is now one of the items from the JSON on the previous page.
// Do whatever you need with it
});
精彩评论