Привет всем, я хочу спросить, как сделать числа автоматически с помощью jquery append ..? Я сделал это, но все равно не удалось. Мой исходный код:

<html>
<head>
    <title>Help Help</title>
</head>
<body>

    <input type="button" id="button" value="Create a number from 1 to N"/>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function ()
        {
            $('#button').click(function()
            {
                $('#result').append('<div class="number">Numbers To ......</div>');
            });
        });
    </script>
</body>
<hr>
results from click button
<hr>
<div id=result></div>
0
user700084 9 Апр 2011 в 19:52
Ваш вопрос не ясен. О каких числах вы говорите? Вы хотите генерировать случайное число при каждом нажатии кнопки? Если да, то в чем ваша проблема? Вы не знаете, как создавать случайные числа?
 – 
Felix Kling
9 Апр 2011 в 19:57
@Феликс, да. Я тоже так думал; пока я не увидел value элемента input. Я предполагаю, что он хочет создать последовательность чисел от 0 до n в div из #result. Хотя это действительно попытка угадать...
 – 
David Thomas
9 Апр 2011 в 20:05

1 ответ

Вот один из способов сделать это:

$('#numbers').change(
    function(){
        var max = $(this).val();
        var sequence;
        for(i=0; i<=max; i++) {
            var text = $('#result').text();
            if (text == false){
                text = i;
            }
            else if (i == max) {
                text = text + ', ' + i + '.';
            }
            else {
                text = text + ', ' + i;
            }
            $('#result').text(text);
        }
    });

$('form').submit(
    function(){
        return false;
    });

Со следующим упрощенным html:

<form action="#" method="post">
    <label for="numbers">Make a sequence of numbers, from one to <em>n</em></label>
    <input type="number" min="0" max="1000" step="1" id="numbers" name="numbers" />
</form>

<div id="result">
</div>

демонстрация JS Fiddle.


Edited Чтобы предложить более краткую версию приведенного выше кода jQuery, предложенную mplungjan (в комментариях ниже):
$('#numbers').change(
    function(){
        var max = $(this).val(),text="";
        for(i=1; i<=max; i++) {
            text += ', ' + i;
        }
        if(text) $('#result').text(text.substring(2)+".");
    });

$('form').submit(
    function(){
        return false;
    });

Пересмотренный/оптимизированный jQuery в JS Fiddle

Ответ преобразован в вики сообщества, поскольку получение репутации за счет чужих усилий кажется неправильным ....

0
2 revs 9 Апр 2011 в 21:18
@mplungjan, спасибо :) Я действительно не удосужился попытаться оптимизировать его, на всякий случай, если это не то, что хотел ОП ... не возражаете, если я отредактирую это в своем ответе, или вы бы предпочли опубликовать свой собственный ?
 – 
David Thomas
9 Апр 2011 в 20:42
Хм - сложно ;) может понадобиться чутье, но все равно его не получить ;) давай, обнови свой
 – 
mplungjan
9 Апр 2011 в 20:46
@mplungjan, спасибо! Поскольку мне было бы неудобно получать репутацию от чужих усилий, я преобразовал ответ в вики сообщества. :)
 – 
David Thomas
9 Апр 2011 в 21:19