-1

私はJavascriptの初心者なので、専門家が修正するのは簡単かもしれません. 私はこれに取り組んでいます: http://www.3dsbuzz.com/receng/test.phpソースコードは以下です。

画像を白いボックスにドラッグすると、テキスト ボックスに値が追加され、mysql クエリがトリガーされてデータが表示されるという考え方です。しかし、私には2つの問題があります:

1) 画像を白いボックスにドラッグすると、画像の値属性が表示されず、「未定義」と表示されます。

2) 変数を使用する代わりに (17 行目で) 値をハードコーディングすると、テキスト ボックスに問題なく入力されますが、ボックスに直接入力するとトリガーされますが、mysql クエリはトリガーされません。

<html>
<head>
<style type="text/css">
#div1 {width:175px;height:97px;border:1px solid #aaaaaa;}
</style>
<script type="text/javascript">
function drag(ev){
    ev.dataTransfer.setData("Text",ev.target.id);
}
function allowDrop(ev){
    ev.preventDefault();
}
function drop(ev){
    ev.preventDefault();
    ev.target.appendChild(document.getElementById(ev.dataTransfer.getData("Text")));
    var newtext = document.dragme.value;
    document.myform.users.value += newtext;
}
function showUser(str){
if (str==""){
  document.getElementById("txtHint").innerHTML="";
  return;
  }
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
}
xmlhttp.open("GET","getuser.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form name="myform">
<input type="text" name="users" onchange="showUser(this.value)">
</form>
<div id="txtHint"><b>Type "49" or "50" in the box above</b></div>
<br>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
<br />
<img id="49" name="dragme" value="49" src="http://www.3dsbuzz.com/wp-content/uploads/2012/06/mutantmuddsthumb.jpg" draggable="true" ondragstart="drag(event)" />
<img id="50" name="dragme" value="50" src="http://www.3dsbuzz.com/wp-content/uploads/2011/09/layton-thumb.jpg" draggable="true" ondragstart="drag(event)" />
</body>
</html>
4

2 に答える 2

0

すべきではない

var newtext = document.draging.value;

なれ

var newtext = document.dragimg.value;

ドラッグが定義されていないためです。

于 2012-08-26T16:43:11.797 に答える
0

value1) 画像には固有のプロパティがありません。値に使用するgetAttributeか、ID と値が同じであるため、ドロップされた画像の ID を取得する必要があります。

function drop(ev){
    ev.preventDefault();
    ev.target.appendChild(document.getElementById(ev.dataTransfer.getData("Text")));
    var newtext = ev.dataTransfer.getData("Text");
    document.myform.users.value += newtext;
}

2) 変更ハンドラは、スクリプトが値を変更した場合ではなく、ユーザーが値を変更した場合にのみ呼び出されます。手動でトリガーする必要があります。

showUser(newtext);
于 2012-08-26T16:49:06.397 に答える