0

これに関連していくつかの質問をしましたが、すべて非常に良い回答が得られたので、関連するより良い回答を得たいと思っています.

ページに 9 個のボタンがあり、テキスト入力があります。ユーザーがボタンの 1 つをクリックすると、テキスト入力フィールドに入力したテキストがそのページの別のテキスト ボックスに転送されますが、そのボタンの色も変更したいと考えています。

だから私は私のhtmlのために持っているものはこれです：

<input id="fbvalbox" type="text" placeholder="Your personal message" />
<input id="butval1" class="butz" type="button" name="design1" value="Choose Design" onclick="changeID(this);" />

これは 1 つのテキスト ボックスと 1 つのボタンです。それで、これが私のもう一つのボックスです。そのボックスに入力されたメッセージをこのボックスに送りたいのです。

<input id="design_choice" type="text" value="" />

さて、私の JavaScript の場合、これは私のデザイン選択テキスト ボックスにメッセージを転送する私のスクリプトです。

window.onload = function(){
    document.getElementById('butval1').onclick = function(){
    document.getElementById('design_choice').value = document.getElementById('fbvalbox').value;   
}

それはうまくいきますが、ボタンの色も変えたいです。

そのため、最初のボックスに onclick="changeId(this)" を追加しましたが、機能しませんでした。これは別の .js ファイルですが、ページの先頭にもあります。

function changeID(elm){
    var NAME = elm;
    var currentClass = NAME.className;
        if (currentClass == "butz") { 
            NAME.className = "butzz";   
        } else {
            NAME.className = "butz";  }

今、それを単独で使用するとうまく機能しますが、これらの onclick の両方を実行したいと考えています。最初のものは、ID で値を転送するように書きました。そして2番目のjsは、cssクラスを変更するために書かれています

両方走らせたい。どんな助けでも大歓迎です。

ありがとうございました

4

2 に答える 2

2

jQuery タグを使用したことがあるなら、jQuery ソリューションを使用してみませんか

<input id="fbvalbox" type="text" placeholder="Your personal message" />
<input id="butval1" class="butz" type="button" name="design1" value="Choose Design" />
<input id="design_choice" type="text" value="" />

それから

function changeID(elm) {
    $(elm).toggleClass('butz butzz')
}

jQuery(function($){
    $('#butval1').click(function(){
        $('#design_choice').val($('#fbvalbox').val())
    })
})

jQuery(function($){
    $('#butval1').click(function(){
        changeID(this)
    })
})

デモ:フィドル

于 2013-09-12T02:31:16.807 に答える
1

試す：

function changeID(elm){
    document.getElementById('design_choice').value = document.getElementById('fbvalbox').value;
var NAME = elm;
var currentClass = NAME.className;
    if (currentClass == "butz") { 
        NAME.className = "butzz";   
    } else {
        NAME.className = "butz";  }
}

DEMO FIDDLE

注：要件に基づいてテキストボックスIDを変更してください。Arun P Johny が述べたように、jQuery ソリューションを使用することをお勧めします。

于 2013-09-12T02:31:53.077 に答える