Возврат последних 2 символов из выбранной опции html в js - PullRequest
0 голосов
/ 20 сентября 2018

У меня есть поле выбора, к которому прикреплены значения стран (например, Великобритания, Великобритания)

Моя цель - отобразить изображение флага страны на странице в зависимости от выбранной опции

Невозможно вставить путь к изображению в опциях выбора, поэтому я хочу иметь возможность извлечь последние 2 символа значения опции и использовать их в результирующем изображении, например,

<img src="/images/countries/IN.png">

для Индии

Можно ли это сделать с помощью js?

В настоящий момент у меня есть следующее с jQuery, который возвращает текстовое значение выбранной опции, но хочу добиться этого в URL-адресе изображения.

$(document).ready(function(){
    $("select.country").change(function(){
        var selectedCountry = $(".country option:selected").val();
        document.getElementById("resultDiv").innerHTML = selectedCountry;
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<form>
        <label>Select Country:</label>
        <select class="country">
            <option value="United States US">United States US</option>
            <option value="India IN">India IN</option>
            <option value="United Kingdom UK">United Kingdom UK</option>
        </select>
    </form>
    <div id="resultDiv"><img src="images/++RESULT++.png"></div>

Ответы [ 2 ]

0 голосов
/ 03 октября 2018

Мне удалось решить эту проблему с помощью следующего кода.Спасибо всем за помощь!

$(document).ready(function(){
    $("select#country").change(function(){
        var selectedCountry = $("#country option:selected").val();
        var countryCode = selectedCountry.substring(selectedCountry.length-2, selectedCountry.length);
        $("#CountryFlag").html("<img src=\"/images/countries/" + countryCode + ".GIF\"  /> </object>");
    });
});
0 голосов
/ 20 сентября 2018

Вы можете получить последние два символа с помощью .substring ()

selectedValue.substring(selectedValue.length-2, selectedValue.length)
...