JSON and jQuery Search
JSON and jQuery Search
当我使用以下代码时,我不断收到以下错误。感谢您的帮助。我在这个问题上已经坚持了很长一段时间。
tipuedrop.js:60未捕获类型错误:无法读取未定义的属性"search"
function getTipuedrop($obj) {
if ($obj.val()) {
var c = 0;
for (var i = 0; i < tipuedrop_in.pages.length; i++) {
var pat = new RegExp($obj.val(), 'i');
if ((tipuedrop_in.pages[i].name.search(pat) != -1 || tipuedrop_in.pages[i].description.search(pat) != -1) && c < set.show) {
if (c == 0) {
var out = '<div class="tipue_drop_box"><div id="tipue_drop_wrapper">';
}
out += '<a href="' + tipuedrop_in.pages[i].name + '"';
if (set.newWindow) {
out += ' target="_blank"';
}
out += '><div class="tipue_drop_item"><div class="tipue_drop_left"><img src="' + tipuedrop_in.pages[i].name + '" class="tipue_drop_image"></div><div class="tipue_drop_right">' + tipuedrop_in.pages[i].name + '</div></div></a>';
c++;
}
}
if (c != 0) {
out += '</div></div>';
$('#tipue_drop_content').html(out);
$('#tipue_drop_content').fadeIn(set.speed);
}
} else {
$('#tipue_drop_content').fadeOut(set.speed);
}
}
以下是整个Javascript:
(function($) {
$.fn.tipuedrop = function(options) {
var set = $.extend( {
'show' : 3,
'speed' : 300,
'newWindow' : false,
'mode' : 'static',
'contentLocation' : 'tipuedrop/tipuedrop_content.json'
}, options);
return this.each(function() {
var tipuedrop_in = {
pages: []
};
$.ajaxSetup({
async: false
});
if (set.mode == 'json')
{
$.getJSON(set.contentLocation)
.done(function(json)
{
tipuedrop_in = $.extend({}, json);
});
}
if (set.mode == 'static')
{
tipuedrop_in = $.extend({}, tipuedrop);
}
$(this).keyup(function(event)
{
getTipuedrop($(this));
});
function getTipuedrop($obj)
{
if ($obj.val())
{
var c = 0;
for (var i = 0; i < tipuedrop_in.pages.length; i++)
{
var pat = new RegExp($obj.val(), 'i');
if ((tipuedrop_in.pages[i].name.search(pat) != -1 || tipuedrop_in.pages[i].description.search(pat) != -1) && c < set.show)
{
if (c == 0)
{
var out = '<div class="tipue_drop_box"><div id="tipue_drop_wrapper">';
}
out += '<a href="' + tipuedrop_in.pages[i].name + '"';
if (set.newWindow)
{
out += ' target="_blank"';
}
out += '><div class="tipue_drop_item"><div class="tipue_drop_left"><img src="' + tipuedrop_in.pages[i].master_image + '" class="tipue_drop_image"></div><div class="tipue_drop_right">' + tipuedrop_in.pages[i].name + '</div></div></a>';
c++;
console.log(tipuedrop_in.pages[i].name);
console.log(tipuedrop_in.pages[i].description);
}
}
if (c != 0)
{
out += '</div></div>';
$('#tipue_drop_content').html(out);
$('#tipue_drop_content').fadeIn(set.speed);
}
}
else
{
$('#tipue_drop_content').fadeOut(set.speed);
}
}
$('html').click(function()
{
$('#tipue_drop_content').fadeOut(set.speed);
});
});
};
})(jQuery);
JSON数组中有一个元素没有name
和description
属性。它是索引322处id为"dae04696-2acb-4972-a471-1b873e2a8d4f"
的元素:
{
"fees":[],"variations":[],
"available_for_pickup":true,
"available_online":false,
"visibility":"PUBLIC",
"id":"dae04696-2acb-4972-a471-1b873e2a8d4f",
"type":"NORMAL"
}
因此,您的代码将在以下语句中引发错误,因为您试图在未定义的name
属性上使用String方法(搜索):
if ((tipuedrop_in.pages[i].name.search(pat) != -1 || ....
因此,在if
中添加一个附加条件以确保属性存在,并对description
执行同样的操作。
if ((tipuedrop_in.pages[i].name
&& tipuedrop_in.pages[i].name.search(pat) != -1
|| tipuedrop_in.pages[i].description
&& tipuedrop_in.pages[i].description.search(pat) != -1)
&& c < set.show) {
...
请注意,显式转换为String(使用String(tipuedrop_in.pages[i].name)
)也将删除错误条件,因为当name
属性不存在时,它将呈现"undefined"(字符串)。
然而,这有一个副作用:
当你用"undefined"(如"fine")的子字符串搜索时,你会得到一个与这个未定义名称匹配的名称,这可能不是你想要的行为。
创建一些具有名称和描述的变量,然后对其进行搜索
function getTipuedrop($obj) {
if ($obj.val()) {
var c = 0;
for (var i = 0; i < tipuedrop_in.pages.length; i++) {
var pat = new RegExp($obj.val(), 'i');
var nm = String(tipuedrop_in.pages[i].name);
var desc = String(tipuedrop_in.pages[i].description);
if ((nm.search(pat) != -1 || desc.search(pat) != -1) && c < set.show) {
if (c == 0) {
var out = '<div class="tipue_drop_box"><div id="tipue_drop_wrapper">';
}
out += '<a href="' + tipuedrop_in.pages[i].name + '"';
if (set.newWindow) {
out += ' target="_blank"';
}
out += '><div class="tipue_drop_item"><div class="tipue_drop_left"><img src="' + tipuedrop_in.pages[i].name + '" class="tipue_drop_image"></div><div class="tipue_drop_right">' + tipuedrop_in.pages[i].name + '</div></div></a>';
c++;
}
}
if (c != 0) {
out += '</div></div>';
$('#tipue_drop_content').html(out);
$('#tipue_drop_content').fadeIn(set.speed);
}
} else {
$('#tipue_drop_content').fadeOut(set.speed);
}
}
相关文章:
- 无法从 jQuery RSS Feed 中的 localStorage 动态替换类
- 如何使用jQuery自动打开页面上的所有链接
- 如何使用jquery在填充自动完成的值后使文本框只读
- jQuery:循环一个具有不同超时值的循环
- 用程序搜索JQuery数据表中的文本
- 使用 jQuery 的 .on 函数如何获取事件的原始元素
- JSON and jQuery Search
- Jquery Search常见问题解答-轻微修改
- 尝试使用 Tipue Search 4.0 时,jquery 和 jquery 移动版本之间可能存在冲突
- jquery mobile+ filration list search creteria
- Jquery get window.location.search tag in array
- 如何使用 str.search() 或类似方法在 jQuery 中执行条件
- Jquery Autocomplete Search with Ajax Request 作为源数据
- Jquery转义选择器无法识别的表达式:[data route=search/child]
- Jquery - Search in <ul>
- jQuery Mobile Search隐藏搜索选项
- Search in php cURL with jquery
- 使用javascript/jQuery搜索表,并返回正确的表行按钮点击和'Search '酒吧
- 使jQuery Search Filter使用Data属性而不是整个DIV内容
- Localhost jquery.google-search-master控制台错误-$.GoogleSearch不是构