텍스트 입력 팝업 상자를 만드는 방법

Question

내 laravel 응용 프로그램에 텍스트 입력 팝업 상자를 만들어야합니다.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

@foreach ($project->tasks as $task) 
    <ul> 
    <li> 
    <div> 
    <div class="pull-right icons-align"> 
      <a href="" class="editInline"><i class="glyphicon glyphicon-plus"></i></a> 
      <a href="" class="editInline"><i class="glyphicon glyphicon-pencil"></i></a> 
      <a href="" class="editInline"><i class="glyphicon glyphicon-trash"></i></a> 
     </div> 
    <h4><a href="/projects/{{$project->id}}/tasks/{{ $task->id }}">{{ $task->task_name }}</a></h4> 
</div> 
</li> 
</ul> 
    <hr> 
@endforeach 
</head> 
<script> 
$("a.editInline").css("display","none"); 

$('li').on('mouseover mouseout',function(){ 
    $(this).find('.editInline').toggle(); 
    //find the closest li and find its children with class editInLine and 
    //toggle its display using 'toggle()' 
}); 
</script> 
</body> 

때 나는

<a href="" class="editInline"><i class="glyphicon glyphicon-plus"></i></a> 

내가 텍스트 입력 팝업 생성 할 필요가이 버튼의 아이콘을 클릭, 아래의 코드를 참조하십시오. 어떻게해야합니까?

Answer 1

<a href="" class="editInline plusInput"><i class="glyphicon glyphicon-plus"></i></a> 

var count = 0; 
$('.plusInput').click(function(e){ 
e.preventDefault(); 
count++; 
$('any').append('<input type="text" value="Input '+count+'">'); 
}) 

참고 :이 입력

나는이 팝업 코드를 넣어해야

JSFIDDLE DEMO