指定单击以从数据库中动态创建数据
Assign click to dynamically created data from database
我创建了javascript,在其中为丢弃的元素提取数据并创建数据。数据是使用json编码从数据库中提取的。我已经为元素分配了id,但每个元素的点击事件都不起作用。仅获得最后的元素CCD_ 1并且在该CCD_。
JS:
$(document).ready(function () {
var i,j=0;
var x1,x2,y1,y2;
var sf=pf;
sf=Math.round(sf);
var tmp;
var y=null;
var idiv=[];
var fty=ft;
var fd=fid;
var fetch=data;
var x = null;
var count=fetch['count'];
var i=count+1;
//document.write(count);
var rai=[];
//rai[0]='hello';
//document.write(rai[0]);
var ww=[];
var hh=[];
var xx=[];
var yy=[];
var room=[];
var roomt=[];
for(j=0;j<=count;j++)
{
rai[j]=fetch['room_id'+j];
//document.write(rai[j]);
ww[j]=fetch['width'+j];
//document.write(ww[j]);
hh[j]=fetch['height'+j];
xx[j]=fetch['x'+j];
yy[j]=fetch['y'+j];
room[j]=fetch['room'+j];
roomt[j]=fetch['roomt'+j];
//document.write(room[j]);
// alert("data"+rai+" "+ww+" "+hh+" "+xx+" "+yy);
idiv[j]=document.createElement('img')
$('#droppable').append(idiv[j]);
idiv[j].style.position="absolute";
idiv[j].style.left=(xx[j]*sf)+'px';
idiv[j].style.top=(yy[j]*sf)+'px';
idiv[j].style.width=(ww[j]*sf)+'px';
idiv[j].style.height=(hh[j]*sf)+'px';
idiv[j].style.border=1+'px';
idiv[j].id=room[j];
//y=idiv[j].attr('idd',rai[j]);
if(roomt[j]=='garden')
{
idiv[j].src="images/download.jpg";
}
else
{
idiv[j].src="images/ac.png"
}
$(idiv[j]).draggable();
//alert(y);
//y=idiv[j].id;
// alert(y);
//document.write("data"+rai[j]+" "+(ww[j]*sf)+" "+(hh[j]*sf)+" "+(xx[j]*sf)+" "+(yy[j]*sf) + room[j]);
}
//$(this).bind("click",'idiv',function(){
// alert("hello"+idiv.id);
//window.location.href="tables.php?room_id="+y;
// });
});
有人能说出如何在每个提取的元素上进行绑定点击的想法吗。
Ty this:将类添加到创建的元素中,并为所有具有该类的元素编写一个点击事件处理程序。见下文
在创建idiv[j]
-的循环中添加以下html
idiv[j].className = "clickable";
现在使用.on()编写一个点击事件处理程序
$(document).ready(function () {
...... your code start here
......
//loop
for(j=0;j<=count;j++)
{
...
...
}
//loop ends
... more code
....your code end here
$(document).on("click",".clickable", function(){
alert(this.id);
});
});
注意:不要使用bind
,因为它在jQuery 1.5版之后已被弃用
相关文章:
- onkeyup无法动态创建多个文本区域
- 如何使用javascript从主svg对象动态创建svg视图框
- 在动态创建的元素上获取对特定选择器的引用
- JQuery对动态创建的对象进行选择
- 使用jquery动态创建ul-li
- 从动态创建的html选择中选择所选选项
- 如何在动态创建的节点上绑定函数
- 动态创建OnClick事件Javascript
- 谷歌地图动态创建的标记点击事件使用相同的标记
- 在动态创建的标记上添加事件
- 动态创建一个javascript/jquery多级数组
- 如何动态创建许多Jquery颜色选择器(eyecon)
- 如何为动态创建的文本区域中输入的值更新ng模型
- 对动态创建的元素运行jQuery.ech()
- 使用jQuery访问动态创建的项
- 动态创建的iframe中的window.onerror在lne 0处给出脚本错误
- 当用户点击动态创建的链接时,如何调用JS方法.JQuery,ASP.NET MVC
- 我想将链接关联到动态创建的p元素上的相应文章
- AngularJs从列表中动态创建指令
- 使用javascript动态创建html内容/元素