Javascript 动态更改已删除元素的高度和宽度
我已经创建了一个拖放文件,在这个文件中,当单击被拖放的元素时,用户将输入3*4这样的坐标,使用标量因子I获取元素的高度和宽度。我想更改已删除元素的高度和宽度。有人能帮忙吗Javascript 动态更改已删除元素的高度和宽度,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我已经创建了一个拖放文件,在这个文件中,当单击被拖放的元素时,用户将输入3*4这样的坐标,使用标量因子I获取元素的高度和宽度。我想更改已删除元素的高度和宽度。有人能帮忙吗 $(document).ready(function () { var x = null; // Make element draggable $(".drag").draggable({ helper: 'clone', cursor: 'move', tolerance: 'fit
$(document).ready(function () {
var x = null;
// Make element draggable
$(".drag").draggable({
helper: 'clone',
cursor: 'move',
tolerance: 'fit'
});
var i = 1, j = 0;
var x1, x2, y1, y2, tmp, tmp2;
var sf = pf;
$("#droppable").droppable({
drop: function(e, ui) {
var attr = ui.helper.attr('id');
if (typeof attr == typeof undefined || attr == false) {
ui.helper.attr('id',"id"+i);
}
tmp = ui.helper.attr('id');
x = ui.helper.clone().bind("click",'img',function(){
alert("clicked"+ ui.helper.attr('id') + tmp);
leftpos = ui.offset.left-210;
toppos = ui.offset.top;
var cor = window.prompt("Enter coordinates x1,y1");
var c = cor.split(',');
var w = c[0]*sf;
var h = c[1]*sf;
w = w/2;
h = h/2;
ui.helper.width(leftpos-w);
ui.helper.height(toppos-h);
});
x.draggable({
helper: 'original',
containment: '#droppable',
tolerance: 'fit',
});
x.appendTo('#droppable');
ui.helper.remove();
i++;
}
});
});
您的代码中缺少一些东西
事件处理程序是一个单击
,这意味着即使事件处理程序函数在其定义的范围外执行,它也可以访问闭包
。但要更改宽度和高度,需要通过ui.helper
关键字引用当前事件绑定对象此
- 变量
未定义,因此我定义了一个同名的局部变量pf
- 根据您当前的逻辑,目标丢弃项看起来很奇怪,因此我在下面的JSFIDLE中将宽度和高度的静态值设置为300
x= ui.helper.clone().bind("click", 'img', function() {
//leftpos = ui.helper.offset.left - 210;
//toppos = ui.helper.offset.top;
leftpos = ($(this).offset().left) - 210;
toppos = ($(this).offset().top);
...
//ui.helper.width(leftpos-w);
//ui.helper.height(toppos-h);
$(this).width(300);
$(this).height(300);
我不能创建它,因为整个代码都混在一起了。@VinitaVaswani:很难理解你的意思,所以你能在最少的代码内创建一个JSFIDLE吗。这是js fiddle,但是drag n drop在fiddle中也不能正常工作。我只想增加被删除元素的大小,如果它的高度为80,宽度为150,我希望用户输入大小,并更改被删除元素的大小。helper获取被删除的元素,我只想使用代码从元素中心的所有四个侧面更改大小@dreamweiver@madalinivascu我只想更改被删除元素的大小。