0

我有以下情况：

表单在类“formFieldLabel”中具有系统生成的字段（这是使用 from 生成器生成的表单）。这对屏幕阅读器不友好，因为它不使用标签标签，我的目标是基本主题化并使该系统生成的表单更易于访问。所以，我对这个脚本的尝试是......

1) 遍历表单，将 .formFieldLabel 内容复制到数组“labelArray”中

2）在此之后，将适当的数组值粘贴到输入标签旁边的标签标签内

3）最后，删除 .formFielLabel 类，这还没有完成，但我可以轻松完成这部分

// HTML example for one part of the multiple fields
 <div class="formField">
    <table>
    <tr>
        <td class="formFieldLabel"                          >First Name<b style="color: #FF0000; cursor: default" title="Required Field">*</b></td>
        <td class="formFieldLabel" style="padding-left: 5px">Last Name<b style="color: #FF0000; cursor: default" title="Required Field">*</b></td>
    </tr>
    <tr>
        <td                          ><input type="text" class="l6e formFieldText formFieldMediumLeft"  id="form_0004_fld_2_fn" name="First Name" value=""></td>
        <td style="padding-left: 5px"><input type="text" class="l6e formFieldText formFieldMediumRight" id="form_0004_fld_2_ln" name="Last Name" value=""></td>
    </tr>
    <tr><td>&nbsp;</td></tr>
    <tr>
        <td class="formFieldLabel">Email Address<b style="color: #FF0000; cursor: default" title="Required Field">*</b></td>
    </tr>
    <tr>
        <td colspan="2"><input type="Email" class="l6e formFieldText formFieldLarge" id="form_0004_fld_2_em" name="E-mail" value=""></td>
    </tr>
    </table>
</div>

这是我到目前为止执行此操作的脚本。问题是它为每个输入运行整个循环，因此在每个输入旁边它显示 FirstNameLastNameEmail 等等。我觉得我在概念上在这里走错了方向。

// jQuery
var label = $(".formFieldLabel");
var labelArray = [];
for(var i=0;i < label.length; i++) {
  var arrValue = label[i].innerHTML;
  labelArray.push(arrValue);
  insertLabel = $("<label>").append(labelArray[i]).append("</label>");
  $(".formFieldText").before(insertLabel);
};

JSFiddle：http: //jsfiddle.net/qGgwT/

有人可以在这里指出我正确的方向吗？

4

1 回答 1

1

尝试

var label = $(".formFieldLabel");

label.contents().filter(function(){
    return this.nodeType == 3 && $.trim($(this).text()).length > 0 ;
}).wrap('<label />')

演示：小提琴

如果你想换行文本*，label然后

$(".formFieldLabel").wrapInner('<label />')

演示：小提琴

于 2013-09-10T23:11:29.820 回答