teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

2

tuiki

2018/05/29 05:35

投稿

yambejp
yambejp

スコア117883

answer CHANGED
@@ -10,4 +10,29 @@
10
10
  ```
11
11
  ```HTML
12
12
  <label><input type="checkbox">新しいタブで開く</label><a href="hoge.php">hoge</a>
13
+ ```
14
+
15
+ # sample
16
+ 認識の違いがあるようなので。
17
+ リンクを必ずしもアンカーで開く必要はない・・・という考え方もあります
18
+ おすすめはしませんけど
19
+ ```javascript
20
+ $(function(){
21
+ $(':checkbox').on('change',function(){
22
+ $(this).closest('label').next('span').data('target',$(this).prop('checked')?'_blank':'_self');
23
+ }).trigger('change');
24
+ $('span[data-href]').css({
25
+ "text-decoration":"underline"
26
+ }).hover(function(){
27
+ $(this).css({"color":"red","cursor":"pointer"})
28
+ },function(){
29
+ $(this).css({"color":""})
30
+ }).on('click',function(){
31
+ window.open($(this).data('href'),$(this).data('target'));
32
+ }).trigger('change');
33
+ });
34
+ ```
35
+ ```HTML
36
+ <label><input type="checkbox">新しいタブで開く</label><span data-href="hoge.php">hoge</span>
37
+
13
38
  ```

1

修正

2018/05/29 05:35

投稿

yambejp
yambejp

スコア117883

answer CHANGED
@@ -1,6 +1,6 @@
1
1
  システム側で別タブで開くことを想定しなくてはいけないのであれば
2
2
  最初から選択肢を提示しておくことです
3
- さらに気になる右クリックを無効化してください
3
+ さらに気になるなら右クリックを無効化してください
4
4
  ```javascript
5
5
  $(function(){
6
6
  $(':checkbox').on('change',function(){