显示:none似乎不能处理所有html元素

时间:2017-05-31 14:33:19

标签: javascript php html css

我试图通过将其放入divid =贷款

来使表单的这一部分消失

要解决问题,我将TESTTEXT1置于div元素之后,它会执行我想要的操作(当用户单击单选按钮时消失),但TESTTEST2及更高版本似乎不会受到影响用户的行动。有谁知道为什么会这样?

HTML:

<header>


<script>
	function checkA(){
	document.getElementById('loan').style.display='none';
	document.getElementById('assigned').style.display='block';
		}
function checkL(){
	document.getElementById('assigned').style.display='none';
	document.getElementById('loan').style.display='block';
}
</script>	

</header>

<body>

<table>
<td>
		<input type="radio" onclick='checkA()' name="toloan" id="0" value="0"/> <label for="0">To assign</label>
		<input type="radio" onclick='checkL()' name="toloan" id="1" value="1"/> <label for="1">To loan</label>
</td>


<div id="loan">
  TESTTEXT1
  <tr>
    <th>
      <label for="borrowing_month">Borrowing date</label>
    </th>
    <td>
      <select name="borrowing_month" id="borrowing_month">
        
          <option value ='1' selected="selected">
            TEST
          </option>
       </select>
      <select name="borrowing_day" id="borrowing_day">
        
          <option value="2" selected="selected">
      </select>
      <select name="borrowing_year" id="borrowing_year">
          <option value="3" selected="selected">
      </select>
    </td>
  </tr>
  <tr>
    <th>
      <label for="return_month">Return date</label>
    </th>
    <td>
      <select name="return_month" id="return_month">
          <option value="4" selected="selected">
          </option>
      </select>
      <select name="return_day" id="return_day">
          <option value="5" selected="selected">
      </select>
      <select name="return_year" id="return_year">
          <option value="6" selected="selected">
      </select>
    </td>
  </tr>
</div>

</table>
</body>
好的,我试图按要求删除所有的PHP。

2 个答案:

答案 0 :(得分:1)

让我们知道你不能在table-wrappers中使用div元素。如果您希望使用div元素将CSS添加到表的一部分。最好在表头/行/数据中添加一个ID,或者只为表的特定部分创建一个新表。

答案 1 :(得分:0)

正如@DanielBeck指出的那样,没有表格包装器,所以我会尝试将<div id="loan">更改为<table id="loan">

当然,您必须将结束标记从</div>更改为</table>,这会稍微改变您的javascript:

function checkA() {
  document.getElementById('loan').style.display = 'none';
  document.getElementById('assigned').style.display = 'table';
}

function checkL() {
  document.getElementById('assigned').style.display = 'none';
  document.getElementById('loan').style.display = 'table';
}