0
X座標とY座標でボックスを描画しようとしています。しかし、私はサンプルを見つけることができません。クリックした部分だけをほぼ描きたいこの写真の例は間違っています。私はちょうどクリックされたエリアをマークしたい。XとY座標でボックスをJqueryで描画する方法
それは
それはこの
のようにする必要があります間違っているこれは私の抜粋です：
$('[class^="col"]').on("click", function(e) {
\t \t //alert("X: " + e.pageX + " Y: " + e.pageY + " Data: " + $(this).data('area'))
$(this).position().top = e.pageX
$(this).position().left = e.pageY
$(this).css("border", "5px solid #00ff")
\t })<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
\t <div class="row">
\t \t <div class="col-md-12" data-area="1">
\t \t \t <table class="table front-table">
\t \t \t \t <thead>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <th>ID</th>
\t \t \t \t \t \t <th>Title</th>
\t \t \t \t \t \t <th>Content</th>
\t \t \t \t \t </tr>
\t \t \t \t </thead>
\t \t \t \t <tbody>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td class="ID">1</td>
\t \t \t \t \t \t <td class="Title">Test Title</td>
\t \t \t \t \t \t <td class="Content">Test Content</td>
\t \t \t \t \t </tr>
\t \t \t \t </tbody>
\t \t \t </table>
\t \t </div>
\t </div>
\t <hr />
\t <div class="row">
\t \t <div class="col-md-4 col-md-offset-4" data-area="2">
\t \t \t test
\t \t </div>
\t </div>
</div>これは正しく機能しません。どうしたらいいですか？理解しやすい
ため
更新私は、クリックされた領域の周りにボックスを描画します。
これは全く明らかではありません。 「選択領域」*が意味するもの、またはその画像が私たちに見せてくれるもの、または「*正しく動作していない」ことを明確にしていない*正確には – charlietfl
を意味する@charlietfl何を意味するのか分かりません。 – Ali
私はこの全体の問題が理解できないことを意味します – charlietfl