Вырабатывать значения из загруженной информации

Ладно, я понял. Вместо добавления функций с идентификатором, специфичным в DOM, мы можем использовать класс.

Поэтому назначьте классы следующим тегам

 <input type='hidden' value='3.8' id='__odds-3' /> <input style='width: 100%' type='text' name='stake' id='stake-3' aria-describedby='basic-addon1' placeholder='Stake' /> <input style='width:100%' type='text' id='showdynamicreturn-4' aria-describedby='basic-addon2' placeholder='0.00' readonly /> 

Динамически добавлять классы, когда вы создаете эти теги HTML своим javascript. просто назначьте его. Поэтому теги должны выглядеть так:

 <input class="odds" type='hidden' value='3.8' id='__odds-3' /> <input class="stake" style='width: 100%' type='text' name='stake' id='stake-3' aria-describedby='basic-addon1' placeholder='Stake' /> <input class="showdynamicreturn" style='width:100%' type='text' id='showdynamicreturn-4' aria-describedby='basic-addon2' placeholder='0.00' readonly /> 

После этого мы можем использовать Closest с помощью jquery и добавить функцию класса. Это сделает все остальное.

Таким образом, код javascript будет выглядеть следующим образом:

 $(document).ready(function() { $(".stake").on('keyup', function () { var newVal = (parseFloat($(this).val(), 10) * parseFloat($(this).closest(".table").find(".odds").val(), 10)) + parseFloat($(this).val(), 10) || 0; $(this).closest(".table").find(".showdynamicreturn" ).val(parseFloat(newVal).toFixed(2)); }); }); 

Этот код будет работать для всех таблиц независимо от того, сколько у вас есть, и это даст результат только в желаемом оценочном текстовом поле возврата

Рабочая скрипка находится здесь http://jsfiddle.net/6fgw91zx/

Просто проверьте это и дайте мне знать, если это будет полезно

Я думаю, что проблема заключается в использовании переменной i в вашем цикле «за». Вы используете эту переменную в закрытии – если вы поместите предупреждение (i) в обратный вызов keyup, он всегда даст вам общее количество div, независимо от того, какое значение вы изменили.

Чтобы исправить это, я бы предложил вам связать метод keyup более умным способом, примерно так:

  $("body").delegate('.stake', 'keyup', function () { var $input = $(this); var i = parseInt($input.attr('id').replace('stake-', '')); var newVal = (parseFloat($input.val(), 10) * parseFloat($("#__odds-" + i).val(), 10)) + parseFloat($input.val(), 10) || 0; $("#showdynamicreturn-" + i).val(parseFloat(newVal).toFixed(2)); }); 

Чтобы заставить его работать, вам нужно добавить класс «ставка» к вашему элементу ввода

Поскольку вы объявили $ idCount = 0 внутри функции, каждый раз, когда функция вызывается, ей присваивается значение 0. Поэтому, чтобы заставить ее работать так, как мы хотим инициализировать $ idCount со значением нуль globbaly за пределами прототипа функции один раз и выше вызова функции «readbets». это может быть что-то подобное. Я не уверен, что это то, что вы пытаетесь сделать, но я думаю, что это так. Надеюсь, это поможет.

 $idCount=0; //not clear enough if its for multiple users uncomment the foreach loop //foreach ($id as $id){ //each time the idCount incements and the value is stored for next increment. echo readbets( $link, $id, $currentpage, $loggedIn); //} //below is same as your code except that i removed $idCount = 0; function readbets( $link, $id, $currentpage, $loggedIn = true ) { //$idCount = 0; $queryBase = "SELECT * FROM `bets` WHERE `user_id` = '%s';"; if($loggedIn == true) { $queryBase2 = sprintf($queryBase, $id); } else { $queryBase2 = sprintf($queryBase, $id); } $selectQuery = $link->query($queryBase2); $return = "<div style='max-height: 680px; overflow: auto;'>"; while($result = mysqli_fetch_array($selectQuery)) { $idCount++; if($result['odds'] == "SP") { $odds = "SP"; } else { $_odds = explode("/", $result['odds']); $odds = $_odds[0] / $_odds[1]; } $return .= "<div style='border: 1pt solid black; width: 99%;'>"; $return .= "<h2>" . stripslashes($result['title']) . "</h2>"; $return .= "<form action='/' method='post'>"; $return .= "<table class='table table-condensed'>"; $return .= "<tr><td style='width:50%;'>Sport: </td><td>" . $result['sport'] . "</td></tr>"; $return .= "<tr><td style='width:50%'>Participant: </td><td>" . stripslashes($result['participant']) . "</td></tr>"; $return .= "<tr><td>Market: </td><td>" . stripslashes($result['market']) . "</td></tr>"; $return .= "<tr><td>Time: </td><td>" . date("H:i", strtotime($result['bet_till_time'])) . "</td></tr>"; $return .= "<tr><td>Odds: </td><td>" . $result['odds'] . "<input type='hidden' value='" . $odds . "' id='__odds-" . $idCount . "' /></td></tr>"; $return .= "<tr><td>Stake: </td><td><div class='input-group'><span class='input-group-addon' id='basic-addon1'>&pound;</span><input style='width:100%' type='text' name='stake' id='stake-" . $idCount . "' aria-describedby='basic-addon1' placeholder='Stake' /></div></td></tr>"; $return .= "<tr id='dynamic_return'><td colspan='10'><center><div class='input-group'><span class='input-group-addon' id='basic-addon2'>Estimated Return: &pound;</span><input style='width:100%' type='text' id='showdynamicreturn-" . $idCount . "' aria-describedby='basic-addon2' placeholder='0.00' readonly /></div></center></td></tr>"; if($result['ew_available'] == "true") { $return .= "<tr><td><center><label>Each way bet?&nbsp;&nbsp;<input type='checkbox' id='eachWayChk' name='eachWayChk' /></label></center></td>" . "<td><center><input type='submit' name='submitTo__OpenBets' value='Place Bet' /></center></td></tr>"; } else { $return .= "<tr><td colspan='10'><center><input type='submit' name='submitTo__OpenBets' value='Place Bet' /></center></td></tr>"; } $return .= "<!-- Hidden fields for the horses information. -->"; $return .= "<input type='hidden' name='betslip_id' value='" . $result['bet_id'] . "' />"; $return .= "<input type='hidden' name='sport' value='" . $currentpage . "' />"; $return .= "<input type='hidden' name='eachWay' id='eachWay' value='' />"; $return .= "<input type='hidden' name='odds' value='" . $result['odds'] . "' />"; $return .= "<input type='hidden' name='ew_odds' value='" . $result['ew_odds'] . "' />"; $return .= "<input type='hidden' name='sport' value='" . $result['sport'] . "' />"; $return .= "<input type='hidden' name='bettilldate' value='" . $result['bettilldate'] . "' />"; $return .= "<input type='hidden' name='bettilltime' value='" . $result['bettilltime'] . "' />"; $return .= "<!-- Area to \"submit a delete\" and remove an item from the bet slip. -->"; $return .= "<tr><td colspan='100%'><center><input type='submit' name='delete_betslip_item' value='Delete this bet' onclick=\"return confirm('Are you sure you want to delete this?')\" /></center></td></tr>"; $return .= "</table>"; $return .= "</form>"; $return .= "</div><br>"; } $return .= "</div>"; return $return; } 

Или вы можете просто проверить, установлен ли его набор и его значение 0, если не просто оставить его таким, как это, то установите его на ноль. хотя он выглядит довольно таким образом, он будет каждый раз проверять, назначено ли оно или нет.

 function readbets( $link, $id, $currentpage, $loggedIn = true ) { //just added this if else to your code nothing else $idCount = isset($idCount)?$idCount:$idCount=0; //edit end $queryBase = "SELECT * FROM `bets` WHERE `user_id` = '%s';"; if($loggedIn == true) { $queryBase2 = sprintf($queryBase, $id); } else { $queryBase2 = sprintf($queryBase, $id); } $selectQuery = $link->query($queryBase2); $return = "<div style='max-height: 680px; overflow: auto;'>"; while($result = mysqli_fetch_array($selectQuery)) { $idCount++; if($result['odds'] == "SP") { $odds = "SP"; } else { $_odds = explode("/", $result['odds']); $odds = $_odds[0] / $_odds[1]; } $return .= "<div style='border: 1pt solid black; width: 99%;'>"; $return .= "<h2>" . stripslashes($result['title']) . "</h2>"; $return .= "<form action='/' method='post'>"; $return .= "<table class='table table-condensed'>"; $return .= "<tr><td style='width:50%;'>Sport: </td><td>" . $result['sport'] . "</td></tr>"; $return .= "<tr><td style='width:50%'>Participant: </td><td>" . stripslashes($result['participant']) . "</td></tr>"; $return .= "<tr><td>Market: </td><td>" . stripslashes($result['market']) . "</td></tr>"; $return .= "<tr><td>Time: </td><td>" . date("H:i", strtotime($result['bet_till_time'])) . "</td></tr>"; $return .= "<tr><td>Odds: </td><td>" . $result['odds'] . "<input type='hidden' value='" . $odds . "' id='__odds-" . $idCount . "' /></td></tr>"; $return .= "<tr><td>Stake: </td><td><div class='input-group'><span class='input-group-addon' id='basic-addon1'>&pound;</span><input style='width:100%' type='text' name='stake' id='stake-" . $idCount . "' aria-describedby='basic-addon1' placeholder='Stake' /></div></td></tr>"; $return .= "<tr id='dynamic_return'><td colspan='10'><center><div class='input-group'><span class='input-group-addon' id='basic-addon2'>Estimated Return: &pound;</span><input style='width:100%' type='text' id='showdynamicreturn-" . $idCount . "' aria-describedby='basic-addon2' placeholder='0.00' readonly /></div></center></td></tr>"; if($result['ew_available'] == "true") { $return .= "<tr><td><center><label>Each way bet?&nbsp;&nbsp;<input type='checkbox' id='eachWayChk' name='eachWayChk' /></label></center></td>" . "<td><center><input type='submit' name='submitTo__OpenBets' value='Place Bet' /></center></td></tr>"; } else { $return .= "<tr><td colspan='10'><center><input type='submit' name='submitTo__OpenBets' value='Place Bet' /></center></td></tr>"; } $return .= "<!-- Hidden fields for the horses information. -->"; $return .= "<input type='hidden' name='betslip_id' value='" . $result['bet_id'] . "' />"; $return .= "<input type='hidden' name='sport' value='" . $currentpage . "' />"; $return .= "<input type='hidden' name='eachWay' id='eachWay' value='' />"; $return .= "<input type='hidden' name='odds' value='" . $result['odds'] . "' />"; $return .= "<input type='hidden' name='ew_odds' value='" . $result['ew_odds'] . "' />"; $return .= "<input type='hidden' name='sport' value='" . $result['sport'] . "' />"; $return .= "<input type='hidden' name='bettilldate' value='" . $result['bettilldate'] . "' />"; $return .= "<input type='hidden' name='bettilltime' value='" . $result['bettilltime'] . "' />"; $return .= "<!-- Area to \"submit a delete\" and remove an item from the bet slip. -->"; $return .= "<tr><td colspan='100%'><center><input type='submit' name='delete_betslip_item' value='Delete this bet' onclick=\"return confirm('Are you sure you want to delete this?')\" /></center></td></tr>"; $return .= "</table>"; $return .= "</form>"; $return .= "</div><br>"; } $return .= "</div>"; return $return; } 

Наиболее вероятная проблема заключается в том, что idcount и i не соответствуют правильно – возможно, потому, что у вас есть другие divs в коде.

Вы можете значительно упростить то, что вы делаете, и удалить цикл, в котором ошибка возникает, включая все соответствующие материалы (идентификатор) в HTML.

Измените выводимый HTML, чтобы включить идентификационный номер id id в элемент данных, а не с помощью идентификатора. например

 // replace the input element with the one below: <input style='width: 100%' type='text' name='stake' id='stake' data-idnumber='" . $idCount . "' aria-describedby='basic-addon1' placeholder='Stake' /> 

Затем вы можете запустить селектор jQuery следующим образом (без каких-либо циклов – одна строка ниже заменяет весь ваш блок кода, указанный выше)

 $("#stake").on('keyup', function () { var i = parseInt($(this).data("idnumber") , 10); var orginalVal = parseFloat($(this).val(), 10); var newVal = orginalVal * parseFloat($("#__odds-" + i).val(), 10)) + orginalVal || 0; $("#showdynamicreturn-" + i).val(parseFloat(newVal).toFixed(2)); }); 

Заметки:

• есть другие способы; вы могли бы зацикливать divs, как вы это делали (но лучше всего отказаться от более простого селектора, который «div», например, имя класса), а затем использовать «find» для получения правильных элементов для обновления / обработки.
• Замечания Симбы об использовании HTMLSpecialChars и подготовленных инструкциях (и не полагаясь на стриптиз-теги) забиваются на деньги – если HTMLSpecialChars работает некорректно. После того, как вы устраните эту проблему, пожалуйста, следуйте своим комментариям как для собственной безопасности, так и для здравомыслия, тогда ваши данные в беспорядке, о которых вы позже пожалеете! Должен исправить это сейчас, прежде чем вы доберетесь до конца, вы не сможете это исправить. Подготовленные заявления также являются хорошей практикой для раннего, а не более позднего.

Проверьте этот рабочий jsFiddle

изменил немного кода, как показано ниже

 $(document).ready(function() { $("#stake-3").on('keyup', function () { var newVal = (parseFloat($("#stake-3").val(), 10) * parseFloat($("#__odds-3").val(), 10)) + parseFloat($("#stake-3").val(), 10) || 0; $("#showdynamicreturn-4").val(parseFloat(newVal).toFixed(2)); }); }); 

Проверьте это и сообщите мне, если это будет полезно