Question

我正在使用带有jquery mobile，版本1.3.0的phonegap，最近推出了jquery验证（尝试了两个版本，1.11和1.9），我遇到了文本框验证的问题。问题是错误消息放在文本框中，看起来很难看。使用jquery mobile 1.2.0一切正常。我发现了问题，不知道如何优雅地修复它。

使用jquery mobile 1.2.0编写代码：

<label for="phone">Telefon nummer:</label>
        <input type="text" name="phone" class="phone ui-input-text ui-body-c ui-corner-all ui-shadow-inset error" value=""><label for="phone" class="error" style="">Telefonnummer skal oplyses</label>

使用jquery mobile 1.3.0编写代码：

<div class="ui-input-text ui-shadow-inset ui-corner-all ui-btn-shadow ui-body-c"><input type="text" name="phone" class="phone ui-input-text ui-body-c error" value=""><label for="phone" class="error" style="">Telefonnummer skal oplyses</label></div>

正如你在jquery mobile 1.3.0中看到的，他们放了一个div包装器。我该如何解决这个问题？

感谢。

Answer 1

找到了解决方案，相当优雅:)。将其放在验证功能选项中：

        errorPlacement: function(error, element) {

            error.insertAfter( element.parent() );

        }

Answer 2

大！我做了一个调整，因为这对输入有效，而不是在使用JQM 1.3.0时对select，textarea等有效。

errorPlacement: function (error, element) {
                    if (element.is("input") && !element.is('input[type="hidden"]'))
                        error.insertAfter(element.parent());
                    else
                        error.insertAfter(element);

jQuery mobile 1.3.0和jQuery验证

2 个答案: