Question

我的代码有些问题也许你可以提供帮助吗？

Jquery： [已更新]

<script>
$(function() {

     $(".val_error").dialog({
    autoOpen: false,
    show: "blind",
    hide: "explode"
 });
 $(".val_open").click(function(event) {
     var target = $(this).attr("id");
     $('#' + target).dialog('open');
    return false;
 });
    });
</script>

HTML： [已更新]

<p class="first_name>
<div class="val_error" id="first_name_err"><?php echo form_error('first_name'); ?></div>
<label for="contact_first_name"><?php echo $label_values->first_name;?></label>
<?php echo form_input('first_name', $form_values->first_name, 'id="first_name"');?>
<button class="val_open" id="first_name">Open</button>
</p>

<p class="last_name">
<div class="val_error" id="last_name_err"><?php echo form_error('last_name'); ?></div>
<label for="contact_last_name"><?php echo $label_values->last_name;?></label>
<?php echo form_input('last_name', $form_values->last_name, 'id="last_name"');?>
<button class="val_open" id="last_name">Open</button>
</p>

所以基本上我试图让对话框一次只打开一个ID，而不是一次打开..我尝试过以下但没有运气：

Jquery我认为会起作用

<script>
$(function() {

     $(".val_error"+target).dialog({
        autoOpen: false,
        show: "blind",
        hide: "explode"
     });
     $(".val_open").click(function(event) {
            var target = $this.attr("id");
        $(".val_error").dialog("open");
        return false;
     });
    });
</script>

任何帮助/指针甚至想法都会很棒！

http://jsfiddle.net/dRRRd/＆lt; - 可以在这里查看

Answer 1

元素ID必须是唯一的 - 您有两个first_name元素和两个last_name元素。这会引起问题。（您还有两个标签“for”contact_name - 是否有两个带有此ID的元素？）
在您的javascript中，调用target时未定义$(".val_error"+target).dialog({（它在另一个回调函数的范围内声明。）

您要做的是将一个类分配给每个表单组的父元素，然后将其用作选择器以查找您的错误div。尝试这样的事情：

<p class="first_name">
<div class="val_error" id="first_name_err"><?php echo form_error('first_name'); ?></div>
<label for="contact_name"><?php echo $label_values->first_name;?></label>
<?php echo form_input('first_name', $form_values->first_name, 'id="first_name"');?>
<button class="val_open" id="first_name">Open</button>
</p>

<p class="last_name">
<div class="val_error" id="last_name_err"><?php echo form_error('last_name'); ?></div>
<label for="contact_name"><?php echo $label_values->last_name;?></label>
<?php echo form_input('last_name', $form_values->last_name, 'id="last_name"');?>
<button class="val_open" id="last_name">Open</button>
</p>

然后你的jQuery选择器将是$(".first_name .val_error")或$(".last_name .val_error")

Answer 2

以下几行：

var target = $this.attr("id");

$this将查找名为$this的变量，该变量不存在。要获取上下文jQuery对象，请使用$(this)
永远不会读取变量target - 也许你想在下一行$('#' + target).dialog('open');？

但最简单的解决方案可能是删除：

var target = $this.attr("id");
$(".val_error").dialog("open");

..并将其替换为：

$(this).dialog('open');

因为只有一个元素可以获得click事件，并且该元素可以使用$(this)进行定位。

将ID传递给Selector - Jquery

2 个答案: