LOCALページのDIVコンテンツを取得して投稿する方法
基本的に、私の問題について少し説明させてください
このページでは jSFiddle
<script>
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
ev.dataTransfer.setData("Text", ev.target.id);
}
function drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("Text");
var new_img = $('#' + data).clone();
$('#' + ev.target.id).html(new_img);
}
</script>
画像を div にプルするために使用できるようにします。フォーム メソッドの投稿と送信ボタンを追加したい
送信時に、おそらく page2.php に投稿され、page2.php は、ユーザーが内部に引っ張るか、ユーザーが選択した時点で現在の div コンテンツを言うことができる、画像「名前」または「id」を含む 2 つの div 正方形のコンテンツを取得する必要があります。
どうすればそれを達成できますか。ありがとう！私のjsFiddleページを見て、私が尋ねようとしていることをより理解してください:)
ありがとう ！
考えられることの 1 つは、隠しフィールドを使用することです。div1_selection 、 div2_selection 、 div3_selection 、 div4_selection という4つの隠しフィールドを作成し、それらの値は最初は空白です。
ドラッグ アンド ドロップすると、その値はドロップされた画像の ID になります。私の質問は、隠しフィールドにドロップされて設定されたimgの値を取得する方法です（隠しフィールドメソッドが機能する場合）
更新された試行:
<script>
$(document).ready(function(){
$("#sub").submit(function(){
var img1 = $($("#div1").html()).attr("id");
var img2 = $($("#div2").html()).attr("id");
var img3 = $($("#div3").html()).attr("id");
var img4 = $($("#div4").html()).attr("id");
$.ajax({
url: 'setImage.php?img1='+$img1+'&img2='+$img2+'&img3='+$img3+'&img4='+$img4,
type: 'GET',
success: function (data) {$("#newhtml").html(data);}
});
});
});
</script>
<form action="" method="post" id="sub">
// some codes as on jsFiddle
<div id="newhtml"></div>
私のsetImage.phpコード
<?php
$img1 = $_GET['img1'];
$img2 = $_GET['img2'];
$img3 = $_GET['img3'];
$img4 = $_GET['img4'];
echo "IMG 1" . $img1 . " | IMG 2 " . $img2 . " | IMG 3 " . $img3 . " | IMG 4 " . $img4;
?>
返された結果をnewhtmlに表示しようとしましたが、うまくいきません。私が行う ajax の実装に問題はありますか?
ありがとう
最新のアップデート:
<script>
$(document).ready(function(){
$("#input").click(function(){ var img1 = $($("#div2").html()).attr("id");
var img1 = $($("#div3").html()).attr("id");
var img2 = $($("#div3").html()).attr("id");
var img3 = $($("#div3").html()).attr("id");
var img4 = $($("#div4").html()).attr("id");
$.ajax({
url: 'setImage.php',
data:{image1:img1,image2:img2,image3:img3,image4:img4},
type: 'GET',
success: function (data) {
alert(data)
$("#newhtml").html(data);
}
});
});
});
</script>
変数は送信されませんでした。デフォルトのエコー メッセージを返すだけですが、img1、img2、img3、img4 の値を取得できないようです。