通过getElementById获取用户输入RSS FeedUrl的FeedEk表单提交问题求解

我一直尝试创建一个简易表单，输入Feed Url后即可在HTML页面展示对应内容。我使用https://jquery-plugins.net/rss作为feedUrl的测试模板，该链接可正常运行。
我参照FeedEk官方配置指南完成元素配置，目前编写的代码如下：

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="FeedEk.min.js"></script>
<form method="post" id="form">
  <span>在此处粘贴feed url：</span>
  <input type="text" id="rssUrl">
  <input type="submit" value="submit">
</form>
<div id="divRss">
<script>
var form = document.getElementById("form");
var url = document.getElementById("rssUrl");
form.onsubmit = function(){
  $('#divRss').FeedEk({
    FeedUrl : url,
    MaxCount : 16,
  });
}
</script>
</div>

提交时页面会反复重载，无法实现正常的用户提交功能。

方案一：替换提交按钮为普通按钮（已验证可运行） #

HTML修改 #

将原提交按钮代码：

<input type="submit" value="submit">

修改为普通按钮：

<input type="button" value="enter" id="enter">

JavaScript代码修改 #

var form = document.getElementById("form");
form.enter.onclick = function(){
  var url = document.getElementById("rssUrl").value;
  $('#divRss').FeedEk({
    FeedUrl : url,
    MaxCount : 16,
  });
}

该方案完全满足使用需求。

方案二：保留提交按钮 #

如果需要保留submit按钮功能同时避免页面重置，可在提交事件中调用e.preventDefault()阻止表单默认提交行为，同时注意需要获取输入框的value属性值而非输入框DOM对象本身。此外原代码使用的jQuery版本过旧，建议升级到更高版本获得更好的兼容性和安全性。

内容的提问来源于stack exchange，提问作者VoodooJazz_