Question

我正在编写一个Web应用程序，在create.php

上为您提供2个模板选项

在模板1中，您有以下选项

<input type="file" name="image1" id="image1" required />

<input type="file" name="image2" id="image2" required />

在模板2中，用户有3个额外的输入选项。

但是，我不希望为使用模板1的任何人显示这3个额外输入。

因此我决定用<div id="template2">包围输入，以便我可以使用

$('#template2').hide()删除额外的3个输入输入。见下文

<input type="file" name="image1" id="image1" required /> <input type="file" name="image2" id="image2" required />

<div id="template2"><input type="file" name="image3" id="image3" required /><div>

<div id="template2"><input type="file" name="image4" id="image4" required /><div>

<div id="template2"><input type="file" name="image5" id="image5" required /><div>

问题是这个隐藏只删除了一个模板2 div，但其他的仍然存在。

我也尝试过循环$('#template2').hide()三次，但这也没有解决问题。

所以我现在有点想法......

Answer 1

你必须使用类....你不能有同名的id

  $('.template2').hide();


 <div class="template2"><input type="file" name="image3" id="image3" required /><div>
 <div class="template2"><input type="file" name="image4" id="image4" required /><div>
 <div class="template2"><input type="file" name="image5" id="image5" required /><div>

或者如果你想用户id将div包装成一个：

 $('#template2').hide();

 <div id="template2">
    <input type="file" name="image3" id="image3" required />
    <input type="file" name="image4" id="image4" required />
    <input type="file" name="image5" id="image5" required />
 </div>

Answer 2

ID是唯一的，您只能使用它们来识别元素。要选择多个元素，您应使用class属性。像这样：

HTML：

<div class="template2"><input type="file" name="image3" id="image3" required /><div>

<div class="template2"><input type="file" name="image4" id="image4" required /><div>

<div class="template2"><input type="file" name="image5" id="image5" required /><div>

jQuery的：

$('.template2').hide();

jquery选择器中的Dot（.）是类操作符。

Answer 3

您可以使用class来访问所有输入类型。您可能不需要添加额外的div。只需将类添加到输入类型。

$(".toHide").hide();

看小提琴

http://jsfiddle.net/9qn5v/

使用JQuery隐藏多个div

3 个答案: