У меня есть функция jQuery (следует:
$(this).ready(function () { $("#stake").on('keyup', function () { var newVal = (parseFloat($("#stake").val(), 10) * parseFloat($('#__odds').val(), 10)) + parseFloat($("#stake").val(), 10) || 0; $("#showdynamicreturn").val(parseFloat(newVal).toFixed(2)); }); }); ), и у меня есть более одного атрибута с одним и тем же идентификатором, это означает, что мне нужно, чтобы функция позволяла нескольким вещам изменять его, что это лучший способ сделать это?
Также я хочу, чтобы новое значение добавлялось к значению, отображаемому в области showdynamicreturn для каждого showdynamicreturn , как это сделать?
пример
1) Вход пользователя 1 – возврат f 2
2) Вход пользователя 2 – возврат 4
Отображается в showdynamicreturn – 6
HTML-код здесь
<div style="border: 1pt solid black; width: 99%;"> <h2>1:55 Scottsville - Win</h2> <form action="/sports/football/" method="post"> <table> <tbody> <tr> <td style="width: 50%;">Sport: </td> <td>Horse Racing</td> </tr> <tr> <td style="width: 50%">Participant: </td> <td>Legend Dancer</td> </tr> <tr> <td>Market: </td> <td>Scottsville</td> </tr> <tr> <td>Time: </td> <td>13:55</td> </tr> <tr> <td>Odds: </td> <td>8/1<input type="hidden" value="8" id="__odds"></td> </tr> <tr> <td>Stake: </td> <td> <div class="input-group"><span class="input-group-addon" id="basic-addon1">£</span><input style="width: 100%" type="text" name="stake" id="stake" aria-describedby="basic-addon1" placeholder="Stake"></div> </td> </tr> <tr> <td> <center><label for="eachWay">Each way bet? </label><input type="checkbox" id="eachWay" name="eachWay"></center> </td> <td> <center><input type="submit" name="submitTo__OpenBets" value="Open Bet"></center> </td> </tr> <input type="hidden" name="betslip_id" value="36"><input type="hidden" name="sport" value="football"><input type="hidden" name="odds" value="8/1"><input type="hidden" name="sport" value="Horse Racing"><input type="hidden" name="bettilldate" value="2015-05-13"><input type="hidden" name="bettilltime" value="13:55:00"> <tr> <td colspan="100%"> <center><input type="submit" name="delete_betslip_item" value="Delete this bet"></center> </td> </tr> </tbody> </table> </form> </div>
Генерирующий код:
public function ReadBets_Bet($id, $currentpage, $loggedIn = true) { $queryBase = "SELECT * FROM `vr_wp_bets` WHERE `id` = '%s' AND `is_open` = 'false' ORDER BY `sport` ASC;"; if ($loggedIn == true) { $queryBase2 = sprintf($queryBase, $id); } else { $queryBase2 = sprintf($queryBase, $id); } $selectQuery = mysql_query($queryBase2); $return = "<div style='max-height: 400px; overflow: scroll;'>"; while ($result = mysql_fetch_array($selectQuery)) { $_odds = explode("/", $result['odds']); $odds = $_odds[0] / $_odds[1]; $return .= "<div style='border: 1pt solid black; width: 99%;'>"; $return .= "<h2>" . $result['title'] . "</h2>"; $return .= "<form action='/sports/" . CURRENT_PAGE . "/' method='post'>"; $return .= "<table>"; $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['bettilltime'])) . "</td></tr>"; $return .= "<tr><td>Odds: </td><td>" . $result['odds'] . "<input type='hidden' value='" . $odds . "' id='__odds' /></td></tr>"; $return .= "<tr><td>Stake: </td><td><div class='input-group'><span class='input-group-addon' id='basic-addon1'>£</span><input style='width:100%' type='text' name='stake' id='stake' aria-describedby='basic-addon1' placeholder='Stake' /></div></td></tr>"; if ($result['ew_available'] == "true") { $return .= "<tr><td><center><label for='eachWay'>Each way bet? </label><input type='checkbox' id='eachWay' name='eachWay' /></center></td>" . "<td><center><input type='submit' name='submitTo__OpenBets' value='Open 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='odds' value='" . $result['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' /></center></td></tr>"; $return .= "</table>"; $return .= "</form>"; $return .= "</div><br>"; } $return .= "</div>"; $return .= "<tr id='dynamic_return'><td colspan='10'><center><div class='input-group'><span class='input-group-addon' id='basic-addon2'>£</span><input style='width:100%' type='text' id='showdynamicreturn' aria-describedby='basic-addon2' placeholder='0.00' readonly /></div></center></td></tr>"; //$return .= $queryBase2; return $return; }
ЗАМЕТКА
Используются функции mysql_ * (да, я знаю, обесценены) из-за потребностей и требований клиента.
РЕДАКТИРОВАТЬ
У jQuery у меня теперь есть:
var count_div = 0; $(this).ready(function () { $("div").each(function () { ++count_div; console.log("Counter: " + count_div); }); for (var i = 0; i < count_div; ++i) { $("#stake-" + i).each(function () { console.log("Found stake " + i); }); } for (var i = 0; i < count_div; ++i) { $("#__odds-" + i).each(function () { console.log("Found stake " + i); }); } $("#showdynamicreturn").each(function () { console.log("Found text area"); }); for (var i = 0; i < count_div; ++i) { $("#stake-" + i).on('keyup', function () { var newVal = (parseFloat($("#stake-" + i).val(), 10) * parseFloat($("#__odds-" + i).val(), 10)) + parseFloat($("#stake-" + i).val(), 10) || 0; $("#showdynamicreturn").val(parseFloat(newVal).toFixed(2)); }); } });
Вы не можете этого сделать, поскольку идентификаторы должны быть уникальными в дереве ( указано в спецификации в 3.2.5.1 ).
Когда присутствуют повторяющиеся идентификаторы, которые разрешено большинством браузеров, их порядок возврата в лучшем случае не определен, а в худшем случае вы получите только один элемент.
Простейшим решением, которое должно работать с вашим кодом, является добавление числового суффикса к идентификатору для обеспечения уникальности. Вы можете использовать уникальный идентификатор, который уже существует в ваших данных, или, если у вас есть цикл, просто держите счетчик и добавьте его в фиксированную строку. foo-1 будет работать намного лучше, чем несколько foo .
С числовыми идентификаторами вам нужно будет изменить функцию jQ, чтобы быть чем-то вроде:
var items = 100; $(this).ready(function () { for (var i = 0; i < items; ++i) { $("#stake-" + i).on('keyup', function () { var newVal = (parseFloat($("#stake-" + i).val(), 10) * parseFloat($('#__odds').val(), 10)) + parseFloat($("#stake-" + i).val(), 10) || 0; $("#showdynamicreturn-" + i).val(parseFloat(newVal).toFixed(2)); }); } });