[Jquery UI]請問Droppable如何取得拖曳之後圖片的ID呢
[code]<html><head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.1.custom.min.js"></script>
<script>
$(function(){
var $container = $('#container');
$("img").click(function () {
alert(this.id);
});
$(".obj").draggable({
cursor: 'move',
helper:'clone',
scope:'mydrag'
});
$container.droppable({
accept: '.obj',
activeClass: 'myactive',
hoverClass: 'myhover',
scope:'mydrag',
drop: function(e,ui) {
$(ui.draggable).clone().appendTo($(this)).resizable().parent().draggable({containment: '#container'});
}
});
});
</script>
<link type="text/css" href="css/smoothness/jquery-ui-1.7.1.custom.css" rel="stylesheet" />
<style>
#container {
height: 98%;
width: 50%;
border: 3px solid #ccc;
float: left;
}
#headlist {
float: right;
height: 20%;
width: 48%;
border: 1px solid #ccc;
clear: none;
}
#hairlist {
height: 20%;
width: 48%;
border: 1px solid #ccc;
float: right;
margin-top: 5px;
}
.myactive {
opacity: 0.2;
filter:alpha(opacity:20);
}
.myhover {
border: 5px solid red;
}
#headlist img {
cursor: move;
}
#hairlist img {
cursor: move;
}
</style>
</head>
<body>
<div id="container">
</div>
<div id="headlist">
<img src="images/1.jpg" width="100" height="100" class="obj" id="a" />
<img src="images/2.jpg" width="100" height="100" class="obj" id="b"/>
</div>
<div id="hairlist">
<img src="images/a.png" width="100" height="100" class="obj" id="c"/>
<img src="images/b.png" width="100" height="100" class="obj" id="d"/>
<img src="images/c.png" width="100" height="100" class="obj" id="e" />
<img src="images/d.png" width="100" height="100" class="obj" id="f"/>
</div>
</body>
</html>[/code]我把圖片拖曳到div為container裡面之後
要怎麼取得在container裡面圖片的ID呢 [code js] $(ui.draggable).clone().appendTo($(this)).resizable().parent().draggable({containment: '#container'}); [/code]
你是指 clone 後的這個物件？
直接設定他的 id 即可。 是的
請問該如何寫呢?
$("img").click(function () {
alert(this.id);
}); 要如何在clone之後出來的圖片上面點一下然後alert該id 如果 clone 後沒有 id，可以這樣給 id：
[code js]$(ui.draggable).clone().attr('id, 'xxxx')...[/code]
bind click event：
[code js]$(ui.draggable).clone().click(function() {alert($(this).id)})...[/code] 照wmh大大的說法這樣做的話
每拖曳一次圖片就會出現alert 可是內容是undefined
請參考我這個這樣的做法
[url]http://jsgears.com/thread-328-1-1.html[/url] 我試過後發現 clone() 出來的 id 是一樣的，用 $(this).id 的用法也不對，應該是 this.id
頁:
[1]