В настоящее время я использую Bootstrap 4 Toggle на моей веб-странице и, похоже, не могу найти способ динамического изменения меток на этих переключателях во время выполнения.
Моя цель состоит в том, чтобы иметь тумблер, который при активации показывает обратный отсчет времени, который показывает время, пока он автоматически не переключится на «выкл». Таким образом, по умолчанию состояние «выключено». При активации должно отображаться: «вкл. (5:00)» -> «вкл. (4:59)» -> «вкл. (4:58)» и т. Д. c. Как только таймер достигнет 0:00, состояние снова вернется к «выключен».
Вот фрагмент кода работоспособного кода, с которым можно поиграть:
$('#mybutton').click(function() {
$('#mytoggle').data("on", "new label text")
console.log($('#mytoggle').data("on"))
})
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<input id="mytoggle" type="checkbox" data-on="Ready" data-off="Not Ready" checked data-toggle="toggle" data-size="lg">
<button id="mybutton">Change label</button>
<script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js" />
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous" />
Здесь я хочу добиться того, чтобы при нажатии кнопки «Изменить метку» текст метки «вкл» переключателя переключался на «новый». текст метки ". Есть ли способ добиться этого?