【问题标题】:html / javascript: Prevent <input> value from clearing on form submithtml / javascript:防止表单提交时清除 <input> 值
【发布时间】:2013-10-26 06:43:26
【问题描述】:

我有一个只包含一个&lt;input&gt; 元素的表单:

    <form>
            <input
                    type="text"
                    name="webpage-activity-url"
                    placeholder="URL"
                    value="[value inserted by templating engine]"
            />
            <button type="submit" class="button button-secondary" data-action="urlSubmit">
                    Submit
            </button>
    </form>

我还有一些javascript(以coffeescript的形式),在提交表单时调用:

    onURLSubmit: (e)->
            e.preventDefault()
            # console.log('urlSubmit')
            url =  @$el.find('input[name="webpage-activity-url"]').val()
            if _.trim(url) == ''
                    return false
            if url.indexOf('//') == -1
                    url = 'http://' + url
            unless @$el.find('iframe').length > 0
                    iframe = $('<iframe />').insertAfter(@$el.find('.instructor-ui-box').first())
            @setIframeSrc url
            @$el.find('input[name="webpage-activity-url"]').val('')

如果你不熟悉coffeescript,这里是编译成javascript的相同函数:

WebpageActivityLayout.prototype.onURLSubmit = function(e) {
  var iframe, url;
  e.preventDefault();
  url = this.$el.find('input[name="webpage-activity-url"]').val();
  if (_.trim(url) === '') {
    return false;
  }
  if (url.indexOf('//') === -1) {
    url = 'http://' + url;
  }
  if (!(this.$el.find('iframe').length > 0)) {
    iframe = $('<iframe />').insertAfter(this.$el.find('.instructor-ui-box').first());
  }
  this.setIframeSrc(url);
  return this.$el.find('input[name="webpage-activity-url"]').val('');
};

这是我的问题:当提交表单时,用户在表单的&lt;input&gt;元素中输入的值被清除并返回到输入元素的placeholder属性指定的值。我想阻止这种行为。我尝试单步执行 javascript 函数,我注意到当onURLSubmit 函数返回时,输入元素的值被重置。所以我真的不知道如何通过javascript来防止这种情况。

【问题讨论】:

    标签: javascript jquery html forms coffeescript


    【解决方案1】:

    这一行...

    @$el.find('input[name="webpage-activity-url"]').val('')
    

    ...正在将值设置为 ''

    【讨论】:

    • 谢谢,我只需要第二双眼睛...我以为是.val()获取值而不是设置它... d'oh
    • val() 如果没有传递参数,则返回该值。空字符串计为参数,因此它设置值。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-04-04
    • 2015-04-05
    • 2020-11-30
    • 2021-01-30
    • 1970-01-01
    相关资源
    最近更新 更多