2013-06-04 1 views
1

나는이 모든 것에 익숙하지 만이 사이트에서 대부분 배우기 때문에 매우 유용합니다. 그리고 여러분들로부터 도움을 받기로 결정했습니다.여러 파일 입력

필자는 파일 입력 버튼의 스타일을 지정하고 텍스트 필드 내부에 파일 이름을 인쇄했습니다. 이제는 같은 페이지에 여러 파일 입력 (파일 이름이있는 텍스트 필드와 함께)에서 이러한 클래스를 사용하고 싶습니다. (더 많은 파일 입력이 필요합니다. 한번에 더 많은 파일이 필요 없습니다.)

필자는 ID를 사용할 수 있고 필요한 모든 파일 필드에 대해 JS를 복제 할 수 있음을 알고 있지만 한 가지 기능으로 수행하거나 " 역동적 인 "대량 사용.

<div class="upload button left"> 
    <input class="upbtn" type="file" name="attachment" />Add attachment 
</div> 
<input class="filename" type="text" /> 

JS :

$(".upbtn").change(function(e) { 
     var datoteka = $(this).val(); 
     var lastIndex = datoteka.lastIndexOf("\\"); 
     if (lastIndex >= 0) { 
      datoteka = datoteka.substring(lastIndex + 1); 
     } 
     $(".filename").val(datoteka); 
    }); 

당신은 여기에 모든 것을 볼 수 있습니다 : http://jsfiddle.net/k5cLt/5/

그래서 나는 약간의 도움 :)

HTML에 대한 부탁 해요

미리 예약 해 주시기 바랍니다.

+1

문제가 무엇인지 정확히 .. 클래스 .upbtn와 JQuery와 포장 된 객체의 배열을 다시 제공하고 그들 모두에 .change()를 호출? – cimmanon

답변

0

가능합니다. 나는 여기에

$(".upbtn").change(function(e) { 
     var datoteka = $(this).val(); 
     var lastIndex = datoteka.lastIndexOf("\\"); 
     if (lastIndex >= 0) 
     { 
      datoteka = datoteka.substring(lastIndex + 1); 
     } 
     var close = $(this).parent().next(".filename:first") 
     close.val(datoteka); 
    }); 

를 사용하여 입력의 JSFiddle

정렬과 같은이 요구되지 않을 수 있습니다으로하지만, JSFiddle 난 당신이 달성하려고하는 생각의 일반적인 생각을 보여줍니다.

+0

네, 그게 정확히 내가 성취하려고했던 것입니다. 고맙습니다. – Dma

+0

및 입력 및 스타일 정렬을 위해 CSS로 파일 입력을 스타일링하고 싶지만 꽤 잘 가지 않아서 이것이 단지 실험 일 뿐이며 최상의 솔루션이 아니라는 것을 알고 있습니다 :) – Dma

0

여러 파일 필드를 사용해 보셨습니까? 당신이 한 일은 그대로해야합니다.

$(".upbtn").change(...); 

+0

예 더 많은 필드를 사용하려고 할 때 예를 들어 두 번째 버튼을 클릭하고 그림을 선택하면 두 텍스트 필드가 채워집니다. 하지만 MikeB는 내 문제를 해결했습니다. 고마워 – Dma