создать больше div, которые показывают текстовые поля после опции, выбранной с помощью jquery - PullRequest
Новая
       30

создать больше div, которые показывают текстовые поля после опции, выбранной с помощью jquery

2 голосов
/ 27 февраля 2012

У меня есть научные статьи, которые я хочу записать.каждая статья имеет несколько ссылок (до 100), и ссылка может быть книгой или статьей.если ссылка - книга, у меня есть имя автора книги, номер страницы книги и т. д., если это статья, тогда я должен получить опубликованный журнал статьи, год публикации статьи и т. д. (естьразличия).

Итак, я хочу позволить пользователю выбрать, если это статья или книга из выпадающего меню в первую очередь.тогда связанные текстовые поля будут видны.пользователь заполняет соответствующую информацию, и ссылка 1 в порядке.затем он нажмет кнопку «Добавить», чтобы добавить еще одну ссылку, поэтому сначала он увидит выпадающее меню, выберет опцию и появятся соответствующие текстовые поля. Вот что у меня есть,

html: 

<div id="content">    
<select id="select">
                <option value="">-chooese-</option>
                <option value="article">article</option>
                <option value="book">book</option>
    </select>

    <input class="article" name="ref_author_name[]"  type="text" id="ref_author_name" />
    <input class="article" name="ref_article_title[]"type="text" id="ref_article_title" />    
    <input class="book"    name="ref_author_name[]"  type="text" id="ref_author_name" />
    <input class="book"    name="ref_thesis_title[]" type="text" id="ref_thesis_title" />
    <input class="button-a" type="button" value="add"/>
</div>

jQuery 

$(function() {
        $('#select').change(function() {
            $("input").hide().filter("." + $(this).find("option:selected").val()).show();
            $(":button").show();
        });
        $(":button").click(function(){
            $('#content').clone().add('#content').appendTo(document.body);
        });
    });

что теперь происходит, когда я выбираю книгу (1-я ссылка), появляются связанные текстовые поля, если я изменяю параметр на книгу, появляются связанные с книгой текстовые поля.нет проблем с первым полем выбора.

но, когда я нажимаю кнопку добавления, появляется новое раскрывающееся меню (2-я ссылка), и я выбираю опцию, снова появляются связанные текстовые поля.НО, дело в том, что все изменения выбора, в том числе первый выбор ..

Я очень плохо знаком с jQuery, и я думаю, что может быть крошечная проблема, но я не могу найти ... любая помощь очень ценится..

1 Ответ

1 голос
/ 27 февраля 2012

Я сделал эту скрипку для тебя: http://jsfiddle.net/MXXXT/16/

По сути, я создаю шаблон для каждого параметра, клонирую его и затем показываю (поскольку шаблон по умолчанию скрыт, см. CSS).

Надеюсь, это поможет.

Отредактировано: обновлена ​​скрипка

...