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

質問編集履歴

4

html追記しました

2019/01/23 01:54

投稿

mei666
mei666

スコア15

title CHANGED
File without changes
body CHANGED
@@ -4,6 +4,27 @@
4
4
  jQueryは、htmlをTableで作成した時のものとなります。
5
5
 
6
6
  ```html
7
+ <!DOCTYPE html>
8
+ <html lang="ja">
9
+ <head>
10
+ <title>Q and A</title>
11
+ <meta http-equiv="X-UA-Compatible" content="IE=Edge">
12
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
13
+ <meta http-equiv="Content-Style-Type" content="text/css">
14
+ <link rel="stylesheet" type="text/css" href="style.css">
15
+ <link rel="stylesheet" type="text/css" href="css/css_qa.css">
16
+ <script type="text/javascript" src="http://code.jquery.com/jquery-2.2.3.min.js"></script>
17
+ <script src="js/jjquery.quicksearch1.js" type="text/javascript">
18
+ </script>
19
+
20
+ </head>
21
+ <body>
22
+ <div id="contents">
23
+ <div id="main">
24
+
25
+ <p> <input type="text" id="search" value=" "> <input type="button" value="and検索" id="button2" id="btn-onoff"> <input type="button" value="すべて表示" id="button3">
26
+ <label><input type="checkbox" id="check1">ハイライト</label>
27
+
7
28
 
8
29
  <div class="cp_qa">
9
30
  <div class="cp_actab">
@@ -30,6 +51,7 @@
30
51
 
31
52
  </div>
32
53
  </div>
54
+ </body>
33
55
  ```
34
56
 
35
57
  ```jQuery

3

タグ修正しました

2019/01/23 01:54

投稿

mei666
mei666

スコア15

title CHANGED
File without changes
body CHANGED
@@ -16,15 +16,15 @@
16
16
  </div>
17
17
  <div class="cp_actab">
18
18
  <input id="cp_tabfour012" type="checkbox" name="tabs">
19
- <label for="cp_tabfour012"><tr><td>Q:ああbb</label>
19
+ <label for="cp_tabfour012">Q:ああbb</label>
20
20
  <div class="cp_actab-content">
21
- <p>A:ううううう</p></tr>
21
+ <p>A:ううううう</p>
22
22
  </div>
23
23
  </div>
24
24
  <div class="cp_actab">
25
25
  <input id="cp_tabfour013" type="checkbox" name="tabs">
26
26
  <label for="cp_tabfour013">Q:いいいいcc</label>
27
- <div class="cp_actab-content"><tr>
27
+ <div class="cp_actab-content">
28
28
  <p>A:ええええええ</p>
29
29
  </div>
30
30
 

2

Tableタグをdivにおきかえてみました

2019/01/22 08:07

投稿

mei666
mei666

スコア15

title CHANGED
File without changes
body CHANGED
@@ -59,4 +59,5 @@
59
59
  $('#button3').on("click", function() {
60
60
  $('$('div.cp_actab').show();
61
61
  });
62
- });
62
+ });
63
+ ```

1

Tableタグをdivに修正してみました

2019/01/22 05:03

投稿

mei666
mei666

スコア15

title CHANGED
File without changes
body CHANGED
@@ -36,28 +36,27 @@
36
36
  $(function() {
37
37
  $('#button1').on("click", function() {
38
38
  var re = new RegExp($('#search').val().trim().replace(/ +/, "|"));
39
- $('#result tbody tr').each(function() {
39
+ $('div.cp_actab').each(function() {
40
- $(this).toggle($(this).find('td').filter(function() {
40
+ $(this).toggle($(this).find('p,label').filter(function() {
41
41
  return $(this).text().match(re) ? true : false;
42
42
  }).length > 0);
43
43
  });
44
44
  });
45
45
  $('#button2').on("click", function() {
46
- $('#result tbody tr').each(function() {
46
+ $('div.cp_actab').each(function() {
47
47
  var tr = $(this);
48
48
  var re = $('#search').val().trim().split(/ +/);
49
49
  var flg = re.map(function(x) {
50
- return tr.has($('td').filter(function() {
50
+ return div.has($('div').filter(function() {
51
51
  return $(this).text().match(new RegExp(x));
52
52
  })).get();
53
53
  }).filter(function(x) {
54
54
  return x.length > 0;
55
55
  }).length == re.length;
56
- tr.toggle(flg);
56
+ div.toggle(flg);
57
57
  });
58
58
  });
59
59
  $('#button3').on("click", function() {
60
- $('#result tr').show();
60
+ $('$('div.cp_actab').show();
61
61
  });
62
- });
62
+ });
63
- ```