【问题标题】:Swap input placeholder text with span text jquery用跨度文本jquery交换输入占位符文本
【发布时间】:2013-06-25 05:16:02
【问题描述】:

我有一个问题,我如何将输入占位符文本与跨度文本交换? ...

    <div class="form-inputs">
      <div class="control-group string required user_name error error_state">
        <label class="string required control-label" for="user_name"><abbr title=
          "required">*</abbr> Name</label>
          <div class="controls">
            <div class="input-prepend">
              <input class="string required" id="user_name" maxlength="100" name=
              "user[name]" pattern="^[^0-9`!@#\$%\^&amp;*+_=]+$" placeholder=
              "Full Name" size="50" type="text" value="" />
            </div>
            <span class="help-inline">can't be blank</span>
          </div>
      </div>

        <div class="control-group email required user_email error input-error">
          <label class="email required control-label" for="user_email"><abbr title=
            "required">*</abbr> Email</label>
            <div class="controls">
              <div class="input-prepend">
                <input class="string email required" id="user_email" maxlength="255"
                name="user[email]" pattern="\A[^@\s]+@([^@\s]+\.)+[^@\s]+\z" placeholder=
                "Email" size="50" type="text" value="" />
              </div>
              <span class="help-inline">can't be blank</span>
            </div>
        </div>

          <div class="control-group password required user_password error input-error">
            <label class="password required control-label" for=
            "user_password"><abbr title="required">*</abbr> Password</label>

            <div class="controls">
              <div class="input-prepend">
                <input class="password optional" id="user_password" maxlength="128" name=
                "user[password]" placeholder="Password" size="50" type="password" />
              </div>
              <span class="help-inline">can't be blank</span>
            </div>
          </div>
        </div>

如果提交时存在错误,我的 rails 代码会添加带有“help-inline”类的 span ...如果没有错误,则不会将这个 span 添加到输入中...

如何将输入占位符文本与跨度文本交换? ... 对于表单中的每个输入 ...

例如...如果第一个字段中有错误,我想将占位符文本“全名”更改为“不能为空”...

非常感谢……

【问题讨论】:

    标签: javascript jquery ruby-on-rails forms coffeescript


    【解决方案1】:

    试试这个 -

    $('#user_name').prop('placeholder', function () {
        return $(this).parent().next('.help-inline').text()
    });
    

    【讨论】:

    • 嘿,谢谢你的帮助......但是那个剂量似乎有效......现在我没有占位符......
    • @SkyKOG 啊,我更新了代码,看这个演示---&gt;jsfiddle.net/RhMj9/3
    • 再次感谢 :) ... $("#user_name").prop "placeholder", $("#user_name").parent().next(".help-inline") .text() if $("#user_name").parent().next(".help-inline").text().length
    【解决方案2】:

    这就是成功的方法:

    Javascript:

    $("input").each(function() {
      if ($(this).parent().next(".help-inline").text().length) {
        $(this).prop("placeholder", $(this).parent().next(".help-inline").text());
        return $(this).val("");
      }
    });
    

    咖啡脚本:

    $("input").each ->
        if $(this).parent().next(".help-inline").text().length
          $(this).prop "placeholder", $(this).parent().next(".help-inline").text()
          $(this).val ""
    

    【讨论】:

      猜你喜欢
      • 2017-01-22
      • 2017-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-12-08
      • 2014-01-04
      • 1970-01-01
      • 2012-02-06
      • 1970-01-01
      相关资源
      最近更新 更多