从jQuery中的字符串获取URL的域名

时间:2017-02-18 18:51:27

标签: javascript jquery

所以我有一个文本框,用户可以写一个URL。

我有一个国家'的下拉菜单旗帜及其代码。

我想要实现的是当用户键入URL时,该标志将更改为URL的域。示例:如果用户键入google.com,则下拉列表应选择点后的值,选择美国国旗。

我正在使用此库:https://github.com/mrmarkfrench/country-select-js

这是我的HTML代码:

<form method="post">
    <input type="hidden" name="addsite" value="true" />
    <p>
        <label for="site_url">Site url:</label>
        <input type="text" name="site_url" id="urlText" placeholder="domain.xxx" value=""  />
    </p>
    <label for="site_url">Search locale:</label>
    <input id="country_selector" type="text">
    <label for="site_url"></label>
    <br>
    <br>
    <input type="submit" name="submit" class="btn" value="Add">
</form>

以下是脚本:

//the script to initalize the dropdown
$("#country_selector").countrySelect({
    defaultCountry: "dk",
    //onlyCountries: ['us', 'gb', 'ch', 'ca', 'do'],
    preferredCountries: ['dk', 'gb', 'us', 'ca']
});

//script to change the dropdown value
$('#urlText').change(function changeCountry(string selectedCountryValue) {
    $("#country_selector").countrySelect("selectCountry", $selectedCountryValue);
});

//script I've attempted to write
(function($) {
    $('#urlText').on('change', function() {
        var value = this.value,
            parts = this.value.split('.'),
            str, $opt;
        for (var i = 0; i < parts.length; i++) {
            str = '.' + parts.slice(i).join('.');
            $opt = $('#country_selector selectCountry[value="' + str + '"]');
            if ($opt.length) {
                $opt.prop('selected', true);
                break;
            }
        }
    })
})(jQuery);

所以后两个脚本都有问题。我如何编写它们以便changeCountry函数接受一个字符串selectedValue然后最后一个函数应该调用changeCountry(str)?

编辑:我想我甚至可能犯了基本的jQuery错误......

2 个答案:

答案 0 :(得分:1)

以下是如何获取网址的域名后缀部分的示例。

&#13;
&#13;
$('#btnGetUrlDomain').on('click', function() {
  var parts = $('#txtUrl').val().split('.')
  var domain = parts[parts.length - 1]
  console.log(domain)
})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id='txtUrl' type='text' value='www.google.com' />
<button id='btnGetUrlDomain'>
Get URL
</button>
&#13;
&#13;
&#13;

那么你只需要调用country-select-js countrySelect方法。

$('#btnGetUrlDomain').on('click', function() {
  var parts = $('#txtUrl').val().split('.')
  var domain = parts[parts.length - 1]
  $("#country_selector").countrySelect("selectCountry", domain);
})

答案 1 :(得分:1)

所以这就是我需要的:

$('#urlText').on('change', function() {
  var parts = $('#urlText').val().split('.')
  var domain = parts[parts.length - 1]
    $("#txtUrls").val(domain);
    $("#country_selector").countrySelect("selectCountry", domain);
})