Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/466.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
使用javascript或JQuery在HTML中删除当前分区的按钮_Javascript_Jquery_Html_Removeclass - Fatal编程技术网

使用javascript或JQuery在HTML中删除当前分区的按钮

使用javascript或JQuery在HTML中删除当前分区的按钮,javascript,jquery,html,removeclass,Javascript,Jquery,Html,Removeclass,我制作了一个带有添加按钮的动态表单,该按钮使用表单的克隆创建了一个新分区,但具有不同的ID。但是,我还希望每个分区都有一个删除按钮,该按钮可以删除它所在的分区,包括按钮本身 我熟悉JQuery.remove()方法,但在选择按钮所在的分区时遇到问题 <div id="attendees"> <div id="att1" class="attendee"> <form name="droplist" action="html_f

我制作了一个带有添加按钮的动态表单,该按钮使用表单的克隆创建了一个新分区,但具有不同的ID。但是,我还希望每个分区都有一个删除按钮,该按钮可以删除它所在的分区,包括按钮本身

我熟悉JQuery
.remove()
方法,但在选择按钮所在的分区时遇到问题

<div id="attendees">
        <div id="att1" class="attendee">
            <form name="droplist" action="html_form_action.asp" method = "get">
                <fieldset>
                    <legend><span class="legend">Filter</span></legend>
                    <label for="select">Category: </label>
                    <select id="select" size="1"  >
                        <option value=" " selected="selected"> </option>
                        <option value="employees">Number of Employees</option>
                        <option value="hits">Hits on TechCrunch</option>
                        <option value="time_founded">Time Founded</option>
                        <option value="total_money">Total Money</option>
                    </select>

                    <div id='radioContainer' style="display:block;">
                        <input type="radio" id="condition"  name="button" value="more"/> <label for="condition"> > </label></br>
                        <input type="radio" id="condition1"  name="button" value="less"/> <label for="condition1"> < </label>
                    </div>

                    <div id='radioContainerTime' style="display:block;">
                        <input type="radio" id="condition2"  name="button" value="later"/> <label for="condition"> After </label></br>
                        <input type="radio" id="condition3"  name="button" value="earlier"/> <label for="condition1"> Before </label>
                    </div>

                    <div id = "text_box" style="display:block;">
                        <label for="input_value">Amount: </label>
                        <input type="text" id="box" name="input_value" value="textIn" />
                    </div>
                    <button>remove</button>
                </fieldset>
            </form>
        </div>
        <a href="#" class="add">Add more</a>
</div>​
要删除包含该按钮的
,您可以使用以下命令:

$("button").click(function () {
     $(this).closest(".attendee").remove();
     return(false);
});
这将从单击的按钮中查找父链,找到带有
class=“attendee”
的第一个零件,然后将其删除


仅供参考,我强烈建议在您的删除按钮上添加一个类,因为连接到页面中的所有按钮有点危险

要在“删除”按钮上添加类,请将HTML更改为:

<button class="deleteButton">remove</button>

return(false)
阻止表单中基于单击的任何默认操作。

我如何在“删除”按钮上放置类?此外,当我进行此更改时,该按钮会将我带到表单“操作”指示的新页面“我不希望它这样做的元素”。@Santiago-我在回答的最后已经回答了你的两个问题。
<button class="deleteButton">remove</button>
$(".deleteButton").click(function () {
     $(this).closest(".attendee").remove();
     return(false);
});