spanからdiv要素を得る方法を書いてください

Question

私は多くのdivを含む画像をアップロードするためのフォームを用意しています。私はdivを含むspanの中にあるその絵の名前を得たいと思う。

<form class="dropzone dz-clickable dz-started" action="form_upload.html"> 
<div class="dz-preview dz-processing dz-error dz-complete dz-image-preview"> 
<div class="dz-image"> 
//skipped as it is showing complete image 
</div> 
<div class="dz-details"> 
    <div class="dz-size"> 
     80kb 
    </div> 
    <div class="dz-filename"> 
    <span data-dz-name="">aust_ews.PNG</span> 
    </div> 
</div> 

</div> 

</form> 

私はaust_ews.PNGを取得しようとしているが、取得に失敗しましたよ。ここで

は私の試みです：

var e =$(".dz-filename").val();//failed 

var e =$("#form dz-filename").val();//failed 

Answer 1

.val()は、（入力フィールドを考える）の値を取得していますが、タグの内容を必要とする - あなたは.html()を必要としています。
それ以外の場合は、divではなく、spanの内容を取得する必要があります。そうでない場合は、結果は<span data-dz-name="">aust_ews.PNG</span>になります。コードで

：それはまだ動作しない場合

var e = $('.dz-filename span').html(); 

、あなたはjQueryライブラリがロードされていることを確認してください。 $と入力してEnterを押すだけで、コンソールにチェックインできます。それは "機能"のような何かを述べるべきです。

readyのようなものを実行することをお勧めします。ただ、それはあなたが期待しているやり方でうまくいくことを確認することが：

$(document).ready(function() 
{ 
    var e = $('.dz-filename span').html(); 
}); 

は約readyjquery.com manualの詳細を参照してください。

Answer 2

代わりの

$(".dz-filename").val(); 

は

$(".dz-filename").text(); 

を試してみてくださいdivの内側に、これまでどのようなHTMLまたはテキストの存在は値ではないとして、それはそのdiv要素の内容です。そして、あなたはhtml（）またはtext（）を使ってそれを得ることができます。

val()は、value属性を検索するときにテキスト、選択、ラジオ、チェックボックスなどの入力要素でのみ機能し、それを返します。

Working Fiddle

Answer 3

これを確認してください。それはここで働いている。私は警戒を確認した。

あなたのコードを$(document).ready(function(){}の機能の中に入れてください。

$(document).ready(function(){ 
 
var e = $(".dz-size").html(); 
 
alert(e) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<form class="dropzone dz-clickable dz-started" action="form_upload.html"> 
 
<div class="dz-preview dz-processing dz-error dz-complete dz-image-preview"> 
 
<div class="dz-image"> 
 
//skipped as it is showing complete image 
 
</div> 
 
<div class="dz-details"> 
 
    <div class="dz-size"> 
 
     80kb 
 
    </div> 
 
    <div class="dz-filename"> 
 
    <span data-dz-name="">aust_ews.PNG</span> 
 
    </div> 
 
</div> 
 

 
</div> 
 

 
</form>