基本上我想切换“活动”类。我希望在我的 main.js 文件中包含所有与 JS 相关的代码。我的意思是我不希望我的 #readmore 按钮在其属性中包含 onClick=toggle() 。onClick 方法工作正常,切换我的“活动”类。但问题是不这样做。当我使用下面的代码时,它会自动将“活动”类添加到 .container 并且在我单击 #readmore 时不会删除。顺便说一下,我不想使用 jQuery。
我的代码:
var myBtn = document.querySelector("#readmore");
myBtn.addEventListener("click", toggle());
function toggle() {
document.querySelector(".container").classList.toggle('active');
};
Run Code Online (Sandbox Code Playgroud)
<div class="container">
<div class="content">
<h2>
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nesciunt, modi! Ipsum ab non voluptas facilis maxime architecto nulla consectetur recusandae.
</h2>
<img src="img/img4.jpg" alt="" width="600px">
<a href="#" id="readmore">Read More</a>
</div>
Run Code Online (Sandbox Code Playgroud)
我有 5 个复选框和一个有 6 行(1 个头,5 个主体)的表格,该表格代表问题的选择。如何将每个复选框与每行的第一行对齐?
table,
thead,
td {
border: 1px solid black;
padding: 3px;
}
thead {
font-weight: bold !important;
}
table {
margin: 5px;
margin-bottom: 1rem;
}
.form-check {
margin-left: -20px;
}
Run Code Online (Sandbox Code Playgroud)
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<p style="margin-left: 20px;">
<form id='f1'>
<div class='form-check'><input type='checkbox' class='form-check-input' name='A'></div>
<br>
<div class='form-check'><input type='checkbox' class='form-check-input' name='B'></div>
<br>
<div class='form-check'><input type='checkbox' class='form-check-input' name='C'></div>
<br>
<div class='form-check'><input type='checkbox' class='form-check-input' name='D'></div>
<br>
<div class='form-check'><input type='checkbox' class='form-check-input' name='E'></div>
</form>
<table>
<thead>
<tr>
<td> …
Run Code Online (Sandbox Code Playgroud)