我有一个jquery validate插件的问题对我没有意义.任何人都可以看到我的错误在哪里？
这是我的HTML:
<form id="form">
<input type="text" name="name" class="required" />
<input type="text" name="email" class="required email" />
</form>
<a id="link">Save</a>
这是我的JS
<script src="jquery 1.7.1"></script>
<script src="jquery.validate.1.9"></script>
<script>
$('#link').click(function()
{
$('#form').validate();
if ($('#form').valid()) // check if form is valid
{
// do some stuff
}
else
{
// just show validation errors, dont post
}
});
</script>
表单永远不会被验证或至少.valid()函数总是返回true但我不明白为什么？我使用了validate插件多年但不是在这种情况下.
我正在为jQuery使用一个整洁的排序插件,HTML5 Sortable http://farhadi.ir/projects/html5sortable/但是还没有找到一种理想的方法来序列化数据以作为AJAX POST请求发送(更新数据库).
HTML
<ul class="sortable">
<li data-id="1">One</li>
<li data-id="2">Two</li>
<li data-id="3">Three</li>
<li data-id="4">Four</li>
<li data-id="5">Five</li>
</ul>
jQuery的
$('ul.sortable').sortable().bind('sortupdate', function()
{
var data = ??; // serialize all data-id's ... this is my problem
$.post('/sortupdate.php',data,function(){ // PHP script sets new order in DB
alert('updated');
});
});
所以我想要发生的是当我将LI项拖到新位置时,sortupdate事件应该触发该函数并发送data-id属性值的新顺序.我目前的想法是遍历LI并将属性值添加到数组中.有没有更智能的方法,或者,最有效的循环方式是什么？(我主要是你知道的后端人).谢谢!
我正在使用Isotope插件来过滤我的产品列表.我也使用Bootstrap 3作为一般布局,页面应该是响应的,因此列宽是基于百分比的.我想要相同高度的缩略图和相等的宽度,一个简单的网格.首先,我尝试使用"fitRows"布局模式,但我遇到了错误的列数(在所有浏览器中),并发现Cubica在https://github.com/cubica/isotope上发布了额外的布局行为"Sloppy Masonry" -sloppy-masonry - 这有一个响应网格时修复了列宽的问题.为了解决相同的高度,我做了一个简单的JS来设置所有高度以适应最高的项目.
我的问题:在Chrome中存在缩略图高度出错,太小而内容被切断的问题.(请注意,问题是没有注意到我的resizeboxes()功能.)
(非)有趣的是它不会每次都发生.此外,当我调整Chrome窗口的大小时,布局正确...
我读到Isotope v2(现在测试版)会更好地处理响应式布局,但我无法让它更好地工作.现在我尝试了许多不同的技巧,但我无法按照自己的意愿得到它.目前的代码适用于除Chrome以外的所有主流浏览器...帮助赞赏!
这是我目前(稍微简化)的代码:
<div class="row" id="listing">
<?php foreach ($products as $p): ?>
<div class="col-md-3 list">
<img src="<?=$p->image_file?>" class="img-responsive" />
<h4><?=$p->title?></h4>
</div>
<?php endforeach; ?>
</div>
JS功能达到相同的高度:
function resizeBoxes()
{
var h = 0;
$('div.view').each(function()
{
var b = $(this);
if (h < b.height()) h = b.height();
});
$('div.view').height(h);
}
和init同位素功能:
var $container = $('#listing');
function initIsotope()
{
$container.isotope({
layoutMode: 'sloppyMasonry',
});
}
$(window).resize(function() {
resizeBoxes();
initIsotope();
}); …我已经盯着这个显然不起作用的小代码了.为什么不选择box rel属性获得警报？
HTML:
<select rel="prop216" name="prop[]">
<option value="">- none</option>
<option value="12">Opt 1</option>
<option value="13">Opt 2</option>
</select>
<select rel="prop217" name="prop[]">
<option value="">- none</option>
<option value="12">Opt 1</option>
<option value="13">Opt 2</option>
</select>
jQuery的:
$("select").change(function()
{
var i = 0;
var alteredSelects = [];
$("select").each(function()
{
if ( $(this).val() !== "" )
{
alteredSelects[i][0] = $(this).attr('rel');
alteredSelects[i][1] = $(this).val();
alert ($(this).attr('rel'));
i++;
}
});
});
另见我的jSfiddle:http://jsfiddle.net/ft6Bd/1/
我在Firefox中收到错误
TypeError:无法将undefined转换为object
在线上 alteredSelects[i][0] = $(this).attr('rel');
但似乎无法实现原因.
我有一个javascript函数,可以根据周围的容器大小(依赖于窗口大小)调整大小并使图像居中.我使用jquery作为js框架.该函数需要在文档加载后(文档就绪)执行,但也可以在用户更改浏览器大小时执行,即我在html文档中运行以下内容:
$(document).ready(function(){
fixImageSizes();
});
$(window).resize(function() {
fixImageSizes();
});
但由于某些未知原因,该功能仅在用户调整浏览器大小而不是加载后执行.任何人都可以帮忙吗？
(我的功能是以下知识...)
function fixImageSizes()
{
var cw = $('#imagecontainer').width();
var ch = $('#imagecontainer').height();
$('#imagecontainer img').each(function()
{
var iw = $(this).css('width');
var ih = $(this).css('height');
if (parseInt(iw) < parseInt(cw)) // image width < viewport
{
var newih = Math.ceil(parseInt(ih) * parseInt(cw) / parseInt(iw)) + 'px';
var newimargint = '-' + Math.ceil(parseInt(newih)/2) + 'px';
var newimarginl = '-' + Math.ceil(parseInt(cw)/2) + 'px';
$(this).css({'width':cw,'height':newih,'margin-left':newimarginl,'margin-top':newimargint});
}
if (parseInt(ih) < parseInt(ch)) // image height < viewport
{ …我想要一个包含在h2标签中的标题声明.我期待这很简单,但它在标题之后回应了h2标签.它以下列方式显示:
我正在使用的代码:
echo "<h2>".the_title()."</h2>";
结果:
title
<h2></h2>
如何更正此行为并确保h2标记之间的回显标题结束？