Как получить последний символ .val () в Javascript - PullRequest
0 голосов
/ 21 февраля 2019

Я хочу применить другой цвет фона к моим выбранным элементам в зависимости от выбранной опции.

У меня есть этот фрагмент кода, который я хочу применить к своему делу:

$('select').on('change', function(ev) {
    $(this).attr('class', '').addClass($(this).children(':selected').val());
});

Проблема в том, что в моем случае я не хочу полное значение выбранной опции.Но только последний символ значения, возвращенного .val ()

Я пытался

$(this).attr('class', '').addClass($(this).children(':selected').val().id.slice(-1));

Но это не работает

Я взял этот код из этого Пример Это работает так, как я хочу, но в моем случае значение параметра отличается для каждого параметра, и у меня есть сотни вариантов выбора и параметров.В этом формате:

Name - Date - 1 Letter Variable

Итак, у меня есть такой CSS:

select, option { background: #fff; }
select.P, option[value$='P'] { background: yellow; }
select.O, option[value$='O'] { background: lightblue; }
select.A, option[value$='A'] { background: lightgreen; }
select.R, option[value$='R'] { background: salmon; }

И пример выбора:

<select onchange='myFunction()' id='" . $i . "' name='" . $i . "' style='width: 80px;'>
        <option value='' style='background:white' style='width: 80px;'></option>
        <option value='" . $vacationIdP . "' style='background:yellow' style='width: 80px;'>P</option>
        <option value='" . $vacationIdO . "' style='background:lightblue' style='width: 80px;'>O</option>
        <option value='" . $vacationIdA . "' style='background:lightgreen' style='width: 80px;'>A</option>
        <option value='" . $vacationIdR . "' style='background:salmon' style='width: 80px;'>R</option>
</select>

Ответы [ 3 ]

0 голосов
/ 21 февраля 2019

Вы можете использовать chartAt

$('select').on('change', function(ev) {
  let k = $(this).children(':selected').val();
  console.log(k.charAt(k.length - 1))
  //$(this).attr('class', '').addClass($(this).children(':selected').val());
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
  <option value='abc'> ABC</option>
  <option value='def'>DEF</option>
  <option value='ghi'> GHI</option>
</select>
0 голосов
/ 21 февраля 2019

Попробуйте val (). Pop ();Должен вернуть последний элемент.

0 голосов
/ 21 февраля 2019

Проблема в том, что вы применяете slice к undefined..val().id равно undefined.
В вашем html вы не должны получать последний символ. Это не последний.Используйте это

$('select').on('change', function(ev) {
    $(this).attr('class', '').addClass($(this).children(':selected').val().split('.')[1].trim().slice(-1));
});

JS Fiddle

...