Javascript-форум - Как реализовать это простой javascript на jquery?

Javascript-форум (https://javascript.ru/forum/)

- jQuery (https://javascript.ru/forum/jquery/)

- - Как реализовать это простой javascript на jquery? (https://javascript.ru/forum/jquery/53056-kak-realizovat-ehto-prostojj-javascript-na-jquery.html)

Цитата:

Сообщение от рони (Сообщение 352189)

Vigour9,
неосилил много букв :cray:

В принципе, почти ничего нового тут нет. Просто нужно задать условия, что
если значение текстбокса
больше равно 300 - сделать одно,
если больше равно 200 - сделать другое,
если больше равно 100 - сделать третье.
Можешь хотя бы это подсказать как сделать, на предыдущем упрощенном варианте, а в остальном постараюсь сам как-нибудь разобраться.
В любом случае, спасибо.

Vigour9, строку 41 сами

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   .red {
    color: #FF0000;
  }

  .tooltips-link{
       font-weight: bold;
  }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
  <script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
  <style type="text/css">
 .myclass {
   background: #FFFF00;
 }

  </style>
  <script>
$(function() {
    var td = $("td");
    var valCurs=0.7844;
    var valCursRub=0.0120;
    td.on("input", "input:first", function(event) {
        var totale = +$(event.delegateTarget).find(":hidden").val() * this.value||0;
        var discount=0, sale = 0;
 if(this.value >= 300){
sale = 0.2}
else if(this.value >= 200){
sale = 0.15}
else if(this.value >= 100){
sale  = 0.1};
var discount=totale*sale;
var pureprice=totale-discount;
var CurRate=(pureprice/valCurs).toFixed(2);
var CurRate2=(pureprice/valCursRub).toFixed(2);
var saldo=totale-pureprice;
var CurRate3=(saldo/valCurs).toFixed(2);
var CurRate4=(saldo/valCursRub).toFixed(2);
var Sum = [pureprice+" ман.", sale ? -sale*100 + "%" : "-", saldo ? saldo.toFixed(2)+" ман." : "-"];
var Title = [CurRate,"",""];
        $(event.delegateTarget).nextUntil().each(function(indx, element) {
            $(this).html($("<span/>", {
                "class": "tooltips-link red",
                "text": Sum[indx],
                "title": Title[indx]
            }).tooltip({tooltipClass:"myclass" }))
        })
    })




});
  </script>


</head>

<body>  <table id="demonstration" border="1">
  <tbody>
    <tr>
      <td colspan="5"><b>InnerHtml рядом стоящих ячеек <font color="red">текущего ряда</font> меняются когда я вписываю цифры в текстбокс. Как реализовать это на jQuery?</b></td>
    </tr>
    <tr>
      <td  style="width:100px">Put number</td>
      <td style="width:100px">
        <span class=" spinBox" id="demonstration1">
        <input value="1" type='text' size="5" >
        </span>
        <input type='hidden' value='5' />
      </td>
       <td></td>
       <td></td>
       <td></td>
   </tr>
   <tr>
      <td  style="width:100px">Put 2nd number</td>
      <td style="width:100px">
        <span class=" spinBox" id="demonstration1">
        <input value="1" type='text' size="5"  >
        </span>
        <input type='hidden' value='5' />
      </td>
       <td></td>
       <td></td>
       <td></td>
   </tr>
  </tbody>
</table>

</body>

</html>

Цитата:

Сообщение от Vigour9

привожу более сложный код

Он не сложный, он раздутый. Из-за нарушения правила "не повторяйся". Код не должен повторяться - это тебе не стихотворение.

рони,
Большущий Респект вам Добрый Человек!)

рони,
еще пара маленьких вопросиков.
1.Как сделать, чтобы всё это работало только для <td> конкретной таблицы, по классу или ид.
2.Я добавил спинбокс (+-) к текстбоксу, вот проблемка, когда я ввожу цифру в текстбокс все нормально работает, а когда увеличиваю или уменьшаю число с помощью кнопок спинбокса, ничего не работает. Что тут можно сделать? Как тут реализовать аналог события onchange() в javascript. На javascripte спинбокс работает.
Спасибо за ваше внимание и терпение :)

Так не пойдет?

<input type="number" />

Ниче реализовывать не надо - все нативно работает.

danik.js,
Насколько я знаю, эта штука не на всех браузерах работает и к тому же не очень красиво выглядит.

Цитата:

Сообщение от Vigour9

только для <td> конкретной таблицы, по классу или ид.

var td = $("#demonstration td");
или var td = $("td.Класс");

Цитата:

Сообщение от Vigour9

когда я ввожу цифру в текстбокс все нормально работает, а когда увеличиваю или уменьшаю число с помощью кнопок спинбокса, ничего не работает. Что тут можно сделать?

<span onclick="$(this).next()[0].value--;$(this).next().trigger('input') ">-</span><input value="1" type='text' size="5" ><span onclick="$(this).prev()[0].value++;$(this).prev().trigger('input') ">+</span>

более интересные реализации type="number" с css и ограничением ищите по форуму их много

рони,
еще раз благодарю за быструю и своевременную помощь.