Question

我试图在文本投入领域旁边有一个检查箱。检查箱通常可以打上/注销,但在点击投稿场时,检查箱也应自动打上。

我试图这样做,把文字输入放在检查箱的标签上,但它没有工作。当我使用正常文本而不是投入领域时,它会做一些细微的工作:

<input type="checkbox" id="box">
<label for="box">
  <input type="text">
</label>

我怎么能用超文本/高专来做到这一点? I m在VueJS plugin的背景下工作。

Answer 1

<代码><input> (focus &start edited) overes <label> s, 因此,你必须使用联合材料:

document.querySelector( #text ).addEventListener( click , ()=>{
  document.querySelector( #box ).checked=true
})

<input type="checkbox" id="box">
<input type="text" id="text">

Answer 2

you can use jquery to achieve this:

传真:

<input type="checkbox" id="box">
<label for="box"></label>
<input type="text" id="mytextinput">

JQuery:

$( #mytextinput ).focus(function(){
$( #box ).prop( "checked", true ); // true checks the checkbox false unchecks.
});

Answer 3

Simply add a listener to the text input that checks the box.

const checkbox = document.querySelector( #box );
const input = document.querySelector( input[type="text"] );

input.addEventListener( click , () => {
  checkbox.checked = true;
});

<input type="checkbox" id="box">
<label for="box">
  <input type="text">
</label>

Answer 4

You can do this easily by setting an onclick attribute on text field like:

<input type="checkbox" id="box">
<label for="box">
  <input type="text" onclick="box.checked = true">
</label>

Answer 5

    document.querySelector("#box").addEventListener( click ,function(){
        document.querySelector("#checkbox").checked = true;
    });

    <div>
        <input type="checkbox" id="checkbox">
        <input type="text" id="box">
    </div>

Answer 6

just write it like this (worked for me):

<label>
   <input type="checkbox" id="box">Feeling lucky
</label>

友情链接