js如何更改input框的默认选中状态

js若何更改input框的默认选中状况?input标签是有多种样式的,要操纵js来点窜input标签元素的默认选中状况,就必需先弄清晰input每种样式的选中状况由哪个属性决议。下面,小编就来分类给大师介绍一下若何操纵js来更改input框的默认选中状况。

9d82d158ccbf6c81d80b5cd8b13eb13533fa40c5.jpg

方式/步调

  1. 1

    input标签元素常见的有text、radio、checkbox、button等四种类型,接下来,小编就一一对这四种类型的input标签进行讲解点窜默认选中状况的方式。

    f11f3a292df5e0fec8ed8631516034a85edf720c.jpg
  2. 2

    input标签的text类型,即文本框。它的默认选中状况是未选中,我可以经由过程下面图1如示的方式将以下代码放在</body>标签后,即可改变该input标签的选中状况,但为了便于演示,我们先如图2所示将代码放到了“改变状况”按钮中,大师利用时请参照图1体例,以下其它类型也是一样。

    b90e7bec54e736d11920873896504fc2d56269ca.jpga71ea8d3fd1f4134fdfd0d4e281f95cad1c85e33.jpg
  3. 3

    点窜input标签text类型的默认选中状况,本家儿如果经由过程select()方式来实现,点窜选中状况前后结果如下图所示:

    29381f30e924b899797c730863061d950a7bf6ba.jpg
  4. 4

    input标签的radio类型,即单选框。它的选中状况由“checked”属性节制,若是该属性设置为“checked”则选中,不然不选中。操纵以下代码即可点窜它的选中状况:

    document.getElementById("myradio").checked = !(document.getElementById("myradio").checked );

    此中“!”暗示值取反,即本来是选中,则此刻不选中;本来不选中,则此刻为选中。

    86d6277f9e2f0708e1145d30e424b899a901f2e9.jpg63d0f703918fa0ece86e133d2b9759ee3d6ddb51.jpg
  5. 5

    input标签的checkbox类型,即复选框。复选框的选中状况与单选框一样,都是由checked属性来控,所以可以用以下代码来点窜它的选中状况:

    document.getElementById("mychkbox").checked = !(document.getElementById("mychkbox").checked );

    运行结果如下图所示:

    562c11dfa9ec8a13b95b21d0fa03918fa0ecc0b9.jpg
  6. 6

    input标签的button类型,即按钮。按钮的选中状况就是获取核心,所以我们可以利用focus()函数来使按钮来进行选中,代码如下:

    document.getElementById("mybtn").focus();

    运行结果如下图所示:

    3ac79f3df8dcd100c85789117f8b4710b9122f32.jpg
  • 发表于 2018-08-12 00:00
  • 阅读 ( 909 )
  • 分类:其他类型

相关问题

0 条评论

请先 登录 后评论