0

これは本当に私を困惑させています。replaceWith()ファイル入力フィールドを「クリア」するために使用しています。しかし、それを交換すると、間違った場所に戻されてしまい、その理由がわかりません。タイトルに「突然」という用語を使用したのは、さらに不思議なことに、週末に仕事をやめたときに、交換品が期待どおりに機能していたからです。今、私は仕事に戻りましたが、突然そうではありません。

を呼び出す前のソース HTML は次のreplaceWith()とおりです。

<label>Audio</label>
<i style="color:#888888;">MP3 or OGG format recommended</i>
<br>
<button id="clear_audio_input" style="display:none;">Clear</button>
<input type="file" value="" name="source_audio" style="width:300px;">
<br>
<div style="margin-top:15px;">
    <b>Current: </b>
    <i id="current_audio_source">1360954394_121RuleOfRosePianoEtudeI.mp3</i>
    <br>
    <input id="source_audio_value" class="required_media" type="hidden" value="1360954394_121RuleOfRosePianoEtudeI.mp3" name="source_audio">
    <span id="current_audio_info_a"><input type="checkbox" style="position:relative;top:3px;margin-left:0px;" value="yes" name="source_audio_delete">

現在の音声を削除しますか? 現在のオーディオは置き換えられます

「source_audio」という名前の FILE 入力フィールドの場所に注意してください。「クリア」ボタンの直後です。

を呼び出すreplaceWith()と、HTML は次のようになります。

<label>Audio</label>
<i style="color:#888888;">MP3 or OGG format recommended</i>
<br>
<button id="clear_audio_input" style="display: none;">Clear</button>
<br>
<div style="margin-top:15px;">
    <b>Current: </b>
    <i id="current_audio_source">1360954394_121RuleOfRosePianoEtudeI.mp3</i>
    <br>
    <input type="file" value="" name="source_audio" style="width:300px;">
    <input id="source_audio_value" class="required_media" type="hidden" value="1360954394_121RuleOfRosePianoEtudeI.mp3" name="source_audio">
    <span id="current_audio_info_a" style="display: inline;"><input type="checkbox" style="position:relative;top:3px;margin-left:0px;" value="yes" name="source_audio_delete">

現在の音声を削除しますか? 現在のオーディオは置き換えられます

数行下の別の DIV 内にあることに注意してください。

「クリア」ボタンのアクションを制御するスクリプトは次のとおりです。

$("#clear_audio_input").live("click", function() {
    $("input[name='source_audio']").replaceWith($("input[name='source_audio']").val('').clone(true));
    $("#source_audio_value").val($("#current_audio_source").text());
    $(this).hide();
    $("#current_audio_info_a").show();
    $("#current_audio_info_b").hide();
    checkRequiredMedia();
    return false;
});

これが基本的な意図されたワークフローです。ロード時には、まだクリアするものが何もないため、クリア ボタンは非表示になっています。ユーザーがファイルを選択すると、クリア ボタンが表示されます。ボタンをクリックすると、ファイル入力が (置き換えられることによって) クリアされ、ボタンが再び非表示になり、基本的にフォームがロード時と同じ状態に戻ります。

この奇妙なことが起こっている理由はありますか (特に、数日前には起こっておらず、それ以来何も変更していないため)?

4

1 に答える 1

4

問題は、 という名前の入力が 2 つあるためですsource_audio。これを回避するには、2 つの入力フィールドに ID を指定するか、名前を変更する必要があります。

例えば：

$('#my_file_input').replaceWith('<input id="my_file_input" type="file" name="source_audio" />');
$('#my_hidden_file_input').val('');
于 2013-02-19T18:54:37.637 に答える