Question

我正在尝试创建一个按钮，它将获取上面段落中的文本并将其添加到url的末尾，以便它可以将文本发送到缓冲区。我正在使用javascript来填充段落。这是我正在使用的代码：

<script>
function facebook10Post() {
    var x,address,city,state,zip,beds,baths,sqft,gla,listDate,listPrice,listUrl,team,word1,word2,word3,word4,feature1,feature2,feature3,feature4;
    x = document.getElementById("propertyInfo");
    address = x.elements["address"].value;
    city = x.elements["city"].value;
    state = x.elements["state"].value;
    zip = x.elements["zip"].value;
    beds = x.elements["beds"].value;
    baths = x.elements["baths"].value;
    sqft = x.elements["sqft"].value;
    gla = x.elements["gla"].value;
    listDate = x.elements["listDate"].value;
    listPrice = x.elements["listPrice"].value;
    listUrl = x.elements["listUrl"].value;
    team = x.elements["team"].value;
    word1 = x.elements["word1"].value;
    word2 = x.elements["word2"].value;
    word3 = x.elements["word3"].value;
    word4 = x.elements["word4"].value;
    feature1 = x.elements["feature1"].value;
    feature2 = x.elements["feature2"].value;
    feature3 = x.elements["feature3"].value;
    feature4 = x.elements["feature4"].value;
    link1 = document.getElementById("facebook10Post1").value;
    document.getElementById("facebook10Post1").innerHTML = "NEW LISTING!<br>" + "Check out  " + team + " " + word1 + " new listing at  " + address + "! This " + word2 + " home features " + beds + " beds, " + baths + " baths and " + sqft + " sq ft!<br>" + "For more details & pictures, visit " + listUrl;

<h3>General Property Information</h3>
Address: <input type="text" name="address"><br>
City: <input type="text" name="city"><br>
State: <input type="text" name="state"><br>
Zipcode: <input type="text" name="zip">

<h3>Rooms, Size, Etc.</h3>
Number of Bedrooms: <input type="Number" name="beds"><br>
Number of Bathrooms: <input type="Number" name="baths"><br>
Total Sq Ft: <input type="Number" name="sqft"><br>
GLA: <input type="Number" name="gla">

<h3>Listing Information</h3>
Listing Date: <input type="Date" name="listDate"><br>
Listing Price: <input type="Number" name="listPrice"><br>
Listing URL: <input type="url" name="listUrl"><br>
Team(our) or Solo(my)? <input type="text" name="team"><br>

<h3>Features</h3>
Feature #1: <input type="text" name="feature1"><br>
Feature #2: <input type="text" name="feature2"><br>
Feature #3: <input type="text" name="feature3"><br>
Feature #4: <input type="text" name="feature4"><br>

<h3>Descriptive Words</h3>
Descriptive Word #1: <input type="text" name="word1"><br>
Descriptive Word #2: <input type="text" name="word2"><br>
Descriptive Word #3: <input type="text" name="word3"><br>
Descriptive Word #4: <input type="text" name="word4"><br>

<input type="button" value="Create Posts" onclick="facebook10Post()">

<p id="facebook10Post1"></p>
<button>This is where the button should go</button>

我知道我发送给它的网址需要是＆＃34; https://buffer.com/add?text=＆＃34;但我需要以某种方式添加填充到＆＃34; facebook10Post1＆＃34;到那个网址的末尾。

可能出现在＆＃34; facebook10Post1＆＃34;段落将是：

新上市！看看我在1234 Main Street的现代新品！这个更新的家有5张床，4个浴室和2500平方英尺！有关详细信息和图片，请访问http://www.myrealestatesite.com/main-street

有什么想法吗？

Answer 1

这是一个有用的实用程序函数，用于将查询字符串参数添加到URL。

/**
 * Adds a query string parameter in the provided url.
 * Update parameter if it already exists.
 * Does nothing if value is null or undefined.
 *
 * @param {string} url to modify.
 * @param {string} key of query parameter.
 * @param {string} value of query parameter.
 *
 * @returns {string} modified url.
 */
function addQueryStringParameter(url, key, value) {
    if (value === null || value === undefined) {
        return url;
    }

    value = encodeURIComponent(value);

    var re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i'),
        separator = url.indexOf('?') !== -1 ? '&' : '?';
    if (url.match(re)) {
        return url.replace(re, '$1' + key + '=' + value + '$2');
    } else {
        return url + separator + key + '=' + value;
    }
};

以下是您将如何使用它。

获取段落的价值

var paragraphValue = document.getElementById("facebook10Post1").innerHTML;

构建网址

var url = 'https://buffer.com/add';
url = addQueryStringParameter(url, 'text', paragraphValue);

此问题提供了一些更好的函数示例，用于添加查询字符串参数：How can I add or update a query string parameter? 感谢@Alexei Levenkov发布此链接。

如何使用javascript将文字添加到网址的末尾？

1 个答案: