我需要帮助来更正我的代码。当我单击“保存”按钮以从每个输入字段检索数据时,HTML代码已从我的PHP循环中打印出来,因此我需要使用T
,但无法调整代码。
我不知道为什么,但是如果我在click事件上设置了$this
,则整个代码都可以正常工作,但是如果我单击“保存”按钮,则无法正常工作。
div#edit_list
<div id="edit_fields" class="glass">
<div id="data_holder">
<p>Nome:</p><input type="text" id="ed_name" name="ed_name" value="<?= $name_dex ?>" />
</div>
<div id="data_holder">
<p>Link:</p><input type="text" id="ed_link" name="ed_link" value="<?= $link_dex ?>" />
</div>
<div id="data_holder">
<p>Tipo:</p><input type="text" id="ed_type" name="ed_type" value="<?= $type_dex ?>" readonly />
</div>
<div id="data_holder">
<p>Shiny:</p><label id="cb_holder"><input type="checkbox" id="ed_shy" name="ed_shy" value="s" <?= $ckd; ?> /><span id="checkmark"></span></label>
</div>
<div id="data_holder">
<input id="submit" class="btn1" type="submit" name="save" value="Salva" />
</div>
<div id="nr_dex">#
<?= $px_dex ?>
</div>
<input type="hidden" id="ed_alola" name="ed_alola" value="<?= $alola ?>" />
<input type="hidden" id="ed_alo_type" name="ed_alo_type" value="<?= $alo_type ?>" />
<input type="hidden" id="row" name="row" value="<?= $key ?>" />
</div>
这是一个无效的小提琴:https://jsfiddle.net/04w3fdch/
答案 0 :(得分:0)
摆脱所有, this
通话中的$("#...")
。在click
事件处理程序中,this
是“提交”按钮,但输入字段不包含在按钮内。
您需要将其替换为包含所有输入的DIV。另外,ID应该是唯一的,因此您应该使用类而不是ID。
$(document).ready(function() {
$("input.submit").click(function() {
var row = $(this).closest(".edit_fields");
var j_name = $(".ed_name", row).val();
var j_link = $(".ed_link", row).val();
var j_type = $(".ed_type", row).val();
if ($(".ed_shy").is(":checked")) {
var cb_shy = $(".ed_shy").val();
} else {
var cb_shy = "";
}
alert("Nome = " + j_name);
});
});
p {
margin: 0
}
.edit_fields {
border: 1px solid black;
margin: 5px;
display: inline-block;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="edit_fields" class="glass">
<div class="data_holder">
<p>Nome:</p><input type="text" class="ed_name" name="ed_name" value="Name..." />
</div>
<div class="data_holder">
<p>Link:</p><input type="text" class="ed_link" name="ed_link" value="a link..." />
</div>
<div class="data_holder">
<p>Tipo:</p><input type="text" class="ed_type" name="ed_type" value="type..." readonly />
</div>
<div class="data_holder">
<p>Shiny:</p><label class="cb_holder"><input type="checkbox" class="ed_shy" name="ed_shy" value="s" /><span class="checkmark"></span></label>
</div>
<div class="data_holder">
<input class="submit" class="btn1" type="submit" name="save" value="Salva" />
</div>
</div>
<div class="edit_fields" class="glass">
<div class="data_holder">
<p>Nome:</p><input type="text" class="ed_name" name="ed_name" value="another Name..." />
</div>
<div class="data_holder">
<p>Link:</p><input type="text" class="ed_link" name="ed_link" value="another link..." />
</div>
<div class="data_holder">
<p>Tipo:</p><input type="text" class="ed_type" name="ed_type" value="another type..." readonly />
</div>
<div class="data_holder">
<p>Shiny:</p><label class="cb_holder"><input type="checkbox" class="ed_shy" name="ed_shy" value="s" /><span class="checkmark"></span></label>
</div>
<div class="data_holder">
<input class="submit" class="btn1" type="submit" name="save" value="Salva" />
</div>
</div>
<div class="edit_fields" class="glass">
<div class="data_holder">
<p>Nome:</p><input type="text" class="ed_name" name="ed_name" value="Third Name..." />
</div>
<div class="data_holder">
<p>Link:</p><input type="text" class="ed_link" name="ed_link" value="Third link..." />
</div>
<div class="data_holder">
<p>Tipo:</p><input type="text" class="ed_type" name="ed_type" value="Third type..." readonly />
</div>
<div class="data_holder">
<p>Shiny:</p><label class="cb_holder"><input type="checkbox" class="ed_shy" name="ed_shy" value="s" /><span class="checkmark"></span></label>
</div>
<div class="data_holder">
<input class="submit" class="btn1" type="submit" name="save" value="Salva" />
</div>
</div>