J'utilise JQueryui pour faire glisser-déposer sur l'une de mes pages et pour une raison quelconque, je ne peux pas sembler obtenir un attribut de l'objet UI.Draggable étant transmis dans mon événement de goutte dressé.
ui.draggable.attr ("src") et $ (UI.Draggable) .attr ("src") à la fois renvoyé non défini, cependant si je tapis ui.draggable.html (), je vais récupérer le HTML. Des idées?
4 Réponses :
Je l'ai compris. La solution consiste à appeler ui.draggable.find ("img"). ATTR ("SRC"), je viens de supposer que l'objet UI.Draggable était une image.
Vous pouvez faire de cette façon, par exemple
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>New Web Project</title>
<script src="jquery-1.5.min.js"></script>
<script src="jquery-ui-1.8.16.custom.min.js"></script>
<style>
body{
margin:0;
padding:0;
}
.box{
display:block;
width:100px;
height:50px;
background-color:green;
border:1px solid #000;
}
#drop{
position:absolute;
top:220px;
left:220px;
width:250px;
height:250px;
border:1px solid red;
background:yellow;
z-index:1;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('#boxBesar p').each(function(index,element){
$('#boxBesar p:eq('+index+')').css({
'border':'1px solid #000',
'width':'100px',
'height':'100px',
'position':'absolute',
'left':(index*200)+10,
'z-index':index+2,
'color':'black',
'text-align':'center',
'background':'#ccc'
})
})
.draggable({
revert:true
})
$('#drop').droppable({
drop:dropIt
})
function dropIt(event,ui){
//get an id
**var id=ui.draggable.attr('id')**
//test an id name
alert(id)
}
})
</script>
</head>
<body>
<div id="boxBesar">
<p id="b1">Box 1</p>
<p id="b2">Box 2</p>
</div>
<div id="parent">
<div id="drop" >
</div>
</div>
</body>
</html>
La réponse de Jon est correcte. La solution est simplement simplement essayer la méthode Compte tenu d'un élément HTML déclaré comme "Draggable" de JQuery Ui: P> attr code>, sans tenter d'inspecter l'élément glacible au préalable (sinon vous serez perplexe). ui.draggable.title: undefined
ui.draggable.attr("title"): I am an image!
ui.draggable: [object Object]
-> No Properties
Cette réponse est laissée pour les futurs utilisateurs. Console juste Console Logne par ui.Draggable et développez-la, puis ui.Draggable.context ...... Donc. Vous comprendrez ce que le nom de la source est.
Nommez-vous votre deuxième argument à chuter () 'UI'? Donc:
Drop: fonction (événement, UI) {...Yep, goutte: fonction (événement, ui) {console.log (ui.draggable.attr ("src")); }