Javascript $（窗口）.resize conditional=如果页面小于

我想使用jQuery将dom中的元素（div）从一个地方移动到另一个地方。我的代码工作得太好了，每次调整浏览器的大小时，它都会附加我的代码，然后一直执行到浏览器崩溃

这是我的密码：

$(window).resize(function() {
    var bodyWidth = $(window).width();
    if(bodyWidth < 740){
        $('.GalleryHeader').appendTo('li');
    }
});

$（窗口）。调整大小（函数（）{
var bodyWidth=$（window.width（）；
如果（车身宽度<740）{
$（'.GalleryHeader'）。附加到（'li'）；
}
});

我如何让它只运行一次，这样它只运行一次，然后在将其大小调整到740px以上时，可能会将其放回dom中的原始位置。

试试看

jQuery(function () {
    var flag;
    $(window).resize(function () {
        var bodyWidth = $(window).width();
        console.log(bodyWidth)
        if (flag !== false && bodyWidth < 740) {
            //move the element to new location
            console.log('less')
            flag = false;
        } else if (flag !== true && bodyWidth >= 740) {
            //put it back to original location
            console.log('more')
            flag = true;
        }
    }).resize();
})

jQuery（函数（）{
var标志；
$（窗口）。调整大小（函数（）{
var bodyWidth=$（window.width（）；
console.log（车身宽度）
如果（标志！==false&&bodyWidth<740）{
//将图元移动到新位置
console.log（'less'）
flag=false；
}否则如果（标志！==true&&bodyWidth>=740）{
//把它放回原来的位置
console.log（'more'）
flag=true；
}
}).resize（）；
})

---

演示：

谢谢@arun-p-johny！这看起来是正确的，当我向下调整大小时，它会起作用，但当我向上调整大小时，它会添加许多.GalleryHeader的实例。你认为这是什么原因造成的？@tjcss你能编辑小提琴来重现问题吗。。。因为从我所看到的情况来看，这些条件只满足一次……奇怪的是，你的例子在JSFIDLE和我的HTML上运行得很好，但在我的本地站点上运行得不好，肯定是有其他东西干扰了它。