試圖將字母附加到輸入內的文本

我有一個文本輸入被禁用了使用disabled屬性，但我添加輸入到它的點擊某些類。試圖將字母附加到輸入內的文本

在類I（.I）的單擊上，我將字母I添加到輸入內的現有文本（如果有的話）中。

在類O（.O）的單擊上，我向輸入中的現有文本（如果有）添加字母O.

但是，當我點擊課程時似乎沒有發生任何事情。

這裏是我的代碼：

$('.I').click(function(){ 
     $('#code').text($('#code').text()+"I"); 
    }); 
    $('.O').click(function(){ 
     $('#code').text($('#code').text()+"O"); 
    });

這裏是一個JSFiddel複製問題：http://jsfiddle.net/q3xBY/

來源

2013-04-13 IrfanM

請發表您的HTML代碼。 – Eli

是否包裝在'document.ready'中？代碼運行時是否存在類？在jsfiddle.net中創建一個複製問題的演示 – charlietfl

@ user1479606用小提琴更新了問題。 – IrfanM

獲取和設置輸入元素的值，你應該使用.val()而不是.text()。

$('.I').click(function(){ 
    $('#code').val($('#code').val()+"I"); 
}); 
$('.O').click(function(){ 
    $('#code').val($('#code').val()+"O"); 
});

來源

2013-04-13 02:59:07

而不是硬編碼的每次點擊這樣的，你可以給同一類的所有按鈕：

<button class="I button">I</button> 
<button class="O button">O</button>

那麼你可以申請jQuery來實現像你描述：

$('.button').click(function(event) { 
    var text = $(this).text(); 
    $('input:text').val(function(index, val) { 
     return val + text; 
    }); 
});

Updated Demo

來源

2013-04-13 03:14:10 Eli

有意思，謝謝。 – IrfanM

正如約翰S所說 - 你想要使用.val()而不是.text()。如果你在一個頁面上有多個這樣的實例，並且你不想重複自己，我提供了一個解決方案。

#foo是您在單擊文本輸入修改器時想要更改的文本輸入。 ul[data-change]可以是修飾符的容器，並具有data-change屬性以指定修飾符將在頁面上定位哪個input元素。每個a修飾符元素都有一個data-value屬性，該屬性指定將要添加到mouseclick上的目標input的內容。

HTML：

<input type="text" id="foo" value="" disabled="disabled" /> 
<ul data-change="#foo"> 
    <li><button id="i" data-value="i">i</button></li> 
    <li><button id="a" data-value="a">a</button></li> 
</ul>

JS：

$('[data-change] button').on('click', function(){ 
    var target = $(this).closest('[data-change]').data('change'); 
    $(target).val($(target).val() + $(this).data('value')); 
});

這裏有一個小提琴：http://jsfiddle.net/vpC6D/1/

來源

2013-04-13 03:15:50

試圖將字母附加到輸入內的文本

回答

相關問題