0

ボタンのクリック時にページをリロードしないようにしたい。クリックすると、ページを更新せずにボタンの値を交換したいだけです。どうすればそうできますか？

<button id="4">134</button> // button 1 
<button id="5">234</button> // button 2

ボタン1（IDが「4」のボタン）をクリックした後、次の結果が必要です

// After clicking button 1
<button id="4">234</button> // button 1
<button id="5">134</button> // button 2

HTMLページをリロード/リフレッシュせずにこれを行うにはどうすればよいですか。

4

3 に答える 3

6

更新を防ぐには、 type="button" を追加するだけです

<button id="4" type="button">134</button> 
<button id="5" type="button">234</button>

値の交換については、繰り返しますが、javascript を学習するか、質問をより明確にして、より良い回答を提供できるようにする必要があります。

しかし、あいまいな質問 (#4 をクリックした後にテキストを交換する必要があると述べています) では、jQuery を使用した方向性を示します。このようにすると、一度だけ交換されます。

<script type="text/javascript">
    $(function(){
        $('#4').click(function(){
            $(this).html(234);
            $('#5').html(134);
        });
    });
</script>

jQuery のヘルプ: http://api.jquery.com/

于 2012-12-28T16:26:20.030 に答える
2

あなたは非常に広範な質問をしましたが、それは HTML5 とはまったく関係ありません。この機能を取得するには、JavaScript ハンドラーをボタンにアタッチする必要があります。これに役立つさまざまな JavaScript ライブラリが多数あります。また、生の JavaScript を作成することもできます。

これを達成するには、javascript でのコーディングに関する多くの基本的な学習を行う必要があります。

于 2012-12-28T16:23:20.217 に答える
0

ページのリロードに関する主な問題は、UpHelix の回答によって解決されます。多くのブラウザーのボタンのデフォルトのタイプがリセットされ、問題への回答に記載されているようにページがリロードされます。

そして、バリュースワップのあなたの仕事に関して、私のコードはあなたのために仕事をします

$(function() {
        $('button#4').click(function() {
            var firstButtonVal = $('button#4').text();
            var secondButtonVal = $('button#5').text();
            $('button#4').text(secondButtonVal);
            $('button#5').text(firstButtonVal);
        });
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="4" type="button">134</button>
<button id="5" type="button">234</button>

于 2014-12-16T15:44:04.940 に答える