0

如何用 HTML 标签包围 Zend 表单内的图像元素<a href>?我特别不想要 JS onClick()-Event,因为它在我的情况下似乎无法正常工作(请参阅问题Zend: Redirect from form without validation)。

这就是我在表单中添加图像元素的方式,现在超链接在图像旁边显示为文本“链接”:

    $this->addElement('image', 'btnBack', array (
        'name' => 'btnBack',
        'id'   => 'btnBack',
        'label' => '',
        'title' => 'Go back',
        'alt' => 'Go back',
        'src' => '/img/undo.png'
    ));
    $this->getElement('btnBack')
            ->setDescription('<a href="/admin/groupoverview">Link</a>')
            ->setDecorators(array(
                'ViewHelper',
                array('Description', array('escape' => false, 'tag' => false)),
                array('HtmlTag', array('tag' => 'dd')),
                array('Label', array('tag' => 'dt')),
                'Errors',
              ));
4

1 回答 1

1

这听起来是个坏主意。从您的其他问题来看,您想要的只是一个指向特定 URL 的图像“按钮”。您不应该尝试使用图像输入来执行此操作,因为这是一种提交按钮,因此单击它将提交表单。如果您尝试使用 javascript 覆盖它或使用 HTML 链接包装整个内容,您就是在尝试解决错误的问题。

最简单的方法可能是使用按钮输入。然后,您可以使用 CSS 对其进行样式设置以使其看起来像图像,并添加您的 javascript onclick 操作以使其执行您想要的操作。由于 input type="button" 元素在默认情况下不会在单击时执行任何操作,因此您应该不会遇到以前遇到的任何问题。

$this->addElement('button', 'btnBack', array(
    'id'   => 'btnBack',
    'label' => 'Go back',
    'onclick' => "window.location='/admin/groupoverview'"
));

然后在您的样式表中(用正确的图像尺寸替换宽度和高度):

#btnBack {
    background-image: url(/img/undo.png);
    width: 123px;
    height: 123px;
    border: 0;
    text-indent: -1000px;
    cursor: pointer;
}

text-indent 将文本标签移出视图。如果您绝对不希望这些规则出现在您的样式表中,您可以通过传递样式属性将它们内联到表单元素中。

于 2013-04-17T09:10:10.550 回答