質問編集履歴
2
質問の内容を変えました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -7,28 +7,29 @@
|
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
#
|
|
10
|
+
#解決方法
|
|
11
|
-
右クリック時の処理に対して、現在の選択行の位置をどうやって渡せばいいでしょうか？
|
|
12
11
|
|
|
12
|
+
Jクエリのイベントで統一して、選択行のINDEXをグローバル変数ROWNUMに入れて
|
|
13
|
-
|
|
13
|
+
無事に渡すことができました。（VARを付けずにグローバル化）
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
#課題
|
|
16
|
-
選択行のINDEXをグローバル変数ROWNUMに入れて、
|
|
17
|
-
それを右クリックメニュー時の変数として渡そうとしています。
|
|
18
16
|
|
|
17
|
+
挿入と削除を、力づくで作りました。
|
|
19
|
-
|
|
18
|
+
ところが、挿入と削除の瞬間が分かりにくい状態です。
|
|
20
19
|
|
|
20
|
+
そこでアニメーションを付けたいと思っているのですが、
|
|
21
|
-
|
|
21
|
+
そもそもJQUERYが苦手なので、困っています。
|
|
22
|
+
（泥臭いコード自体も、もっとすっきりしたいところですが、
|
|
23
|
+
現時点では、このコードがもっとも自分には理解しやすいです）
|
|
22
24
|
|
|
23
|
-
|
|
25
|
+
#質問事項
|
|
24
26
|
|
|
25
|
-
|
|
27
|
+
JQUERYでアニメーションを付けたい
|
|
26
|
-
CHROMEブラウザが、右クリック時にデバックができず、
|
|
27
|
-
|
|
28
|
+
JQUERYでコードをすっきりさせたい
|
|
28
29
|
|
|
30
|
+
すみませんが、私の力では、これが限界です。
|
|
29
31
|
|
|
30
32
|
|
|
31
|
-
|
|
32
33
|
```html
|
|
33
34
|
<table id="target" align="center" >
|
|
34
35
|
省略
|
|
@@ -45,22 +46,9 @@
|
|
|
45
46
|
|
|
46
47
|
```javascript
|
|
47
48
|
|
|
48
|
-
$(function () {
|
|
49
|
-
$(document).on('click', '#target tr', function () {
|
|
50
|
-
var tr = $(this).closest('tr')
|
|
51
|
-
var x = tr.children(':eq(1)').text();
|
|
52
|
-
var y = tr.children(':eq(2)').text();
|
|
53
|
-
var frm = parent.frm_a01b
|
|
54
|
-
//イメージズーム関数に渡す
|
|
55
|
-
ysize = y * frm.myimage.height / frm.myimage.naturalHeight - frm.innerHeight / 2;
|
|
56
|
-
frm.scrollTo(0, ysize);
|
|
57
|
-
frm.imageZoom("myimage", "myresult", "lenz", x, y, false);
|
|
58
|
-
});
|
|
59
|
-
//CSVテーブルの上で、マウスを動かしたら色を変更する
|
|
60
49
|
$(document).on('mousemove', '#target tr', function () {
|
|
61
50
|
if (document.getElementById('contextmenu').style.display != "block") {
|
|
62
51
|
$(this).css("background-color", "#CCFFCC").css("cursor", "pointer");
|
|
63
|
-
rownum=this.indexRow;
|
|
64
52
|
}
|
|
65
53
|
});
|
|
66
54
|
$(document).on('mouseout', '#target tr', function () {
|
|
@@ -68,30 +56,35 @@
|
|
|
68
56
|
$(this).css("background-color", "#ffffff").css("cursor", "normal");
|
|
69
57
|
}
|
|
70
58
|
});
|
|
59
|
+
$(document).on("contextmenu", '#target tr', function (e) {
|
|
60
|
+
document.getElementById('contextmenu').style.left = e.pageX + "px";
|
|
61
|
+
document.getElementById('contextmenu').style.top = e.pageY - window.pageYOffset + "px";
|
|
62
|
+
document.getElementById('contextmenu').style.display = "block";
|
|
63
|
+
rownum = this.rowIndex;
|
|
64
|
+
});
|
|
71
65
|
});
|
|
66
|
+
|
|
72
67
|
```
|
|
73
68
|
|
|
74
69
|
```javascript
|
|
75
70
|
|
|
76
|
-
|
|
71
|
+
function menu1() {
|
|
77
|
-
document.body.addEventListener('contextmenu', function (e) {
|
|
78
|
-
document.getElementById('contextmenu').style.left = e.pageX + "px";
|
|
79
|
-
document.getElementById('contextmenu').style.top = e.pageY - window.pageYOffset + "px";
|
|
80
|
-
|
|
72
|
+
var table = document.getElementById('target');
|
|
73
|
+
var row_orig = table.rows[rownum];
|
|
81
|
-
|
|
74
|
+
var row = table.insertRow(rownum + 1);
|
|
82
|
-
|
|
75
|
+
for (var i = 0; i < table.rows[rownum].cells.length; i++) {
|
|
76
|
+
var cell1 = row.insertCell(-1);
|
|
77
|
+
cell1.innerHTML = row_orig.cells[i].innerHTML
|
|
78
|
+
}
|
|
83
|
-
|
|
79
|
+
document.getElementById('contextmenu').style.display = "none";
|
|
84
|
-
});
|
|
85
80
|
}
|
|
86
81
|
|
|
87
|
-
function menu1() {
|
|
88
|
-
alert(rownum, "menu3がクリックされました。");
|
|
89
|
-
var rows = table.insertRow(row);
|
|
90
|
-
}
|
|
91
82
|
function menu2() {
|
|
92
|
-
|
|
83
|
+
var table = document.getElementById('target');
|
|
93
|
-
var
|
|
84
|
+
var row = table.deleteRow(rownum);
|
|
85
|
+
document.getElementById('contextmenu').style.display = "none";
|
|
94
86
|
}
|
|
87
|
+
|
|
95
88
|
function menu3() {
|
|
96
89
|
alert("menu3がクリックされました。");
|
|
97
90
|
}
|
1
変更
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
#問題点
|
|
11
|
-
|
|
11
|
+
右クリック時の処理に対して、現在の選択行の位置をどうやって渡せばいいでしょうか？
|
|
12
12
|
|
|
13
13
|
#具体的な課題
|
|
14
14
|
|