如何更改radiobutton的文字?

时间:2016-07-05 08:48:46

标签: javascript jquery

我有一个带有radiobutton的表单和两个选项("yourself"/"a colleague")

在该表单中,我添加了button进行翻译。

当我点击按钮时,我想将radiobutton的tect更改为法语("Vous-même" / "Un collegue")

我只需要允许我进行此更改的jQuery行。

我试试这个:

NWF $('#'+UserTypeID).find("input:checked").val("Vous-même"); 更改值,但不更改文本。

NWF $('#'+UserTypeID).find("input:checked").text("Vous-même"); 生成错误,因为此行完全隐藏了radiobutton

有人有解决方案吗?

3 个答案:

答案 0 :(得分:0)

如果您有这样的HTML:

<label for="foo">Foo</label>
<input type="radio" id="foo" name="type"/>
<label for="bar">Bar</label>
<input type="radio" id="bar" name="type"/>

然后您可以使用以下方式更改文本:

NWF$('#'+UserTypeID).find('[for="foo"]').text("Vous-même");

答案 1 :(得分:0)

您可以使用以下方式执行此操作:

label能够更改与单选按钮对应的文本。

data属性用于保存您每次​​点击按钮时必须打开的数据。

$(document).ready(function(){
  $('.translate').click(function(){
   $('input[type=radio][name=person]').each(function( index ) {
       var current_element=$(this);
       var done=false;
       var traductions=[current_element.data('traduction-fr'),current_element.data('traduction-en')];
       var current_value=$("label[for='" +current_element.attr("id")+ "']").text();
        $.each(traductions, function( index, value ) {
             if(current_value!= value && !done){
                $("label[for='" + current_element.attr("id")+ "']").text(value); done=true;
            }
         });
     });
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<label for="option1">yourself</label>
  <input type="radio" name="person" id="option1" value="person_1" data-traduction-fr="Vous-même" data-traduction-en="yourself"><br>
  <label for="option2">a colleague</label>
  <input type="radio" name="person" id="option2" value="person_2" data-traduction-fr="Un collegue" data-traduction-en="a colleague"><br>
  <input type="button" value="Translate" class="translate">

答案 2 :(得分:0)

您可以使用jquery map function

来完成
  mAuth.signInWithCredential(credential)
            .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() {
                @Override
                public void onComplete(@NonNull Task<AuthResult> task) {
                    Log.d(TAG, "signInWithCredential:onComplete:" + task.isSuccessful());

                    // If sign in fails, display a message to the user. If sign in succeeds
                    // the auth state listener will be notified and logic to handle the
                    // signed in user can be handled in the listener.
                    if (!task.isSuccessful()) {
                        Log.w(TAG, "signInWithCredential", task.getException());
                        Toast.makeText(LoginActivity.this, "Authentication failed.",
                                Toast.LENGTH_SHORT).show();
                    } else {

使用以下代码

  <label for="option1" data-selected="en" data-en="yourself" data-fr="Vous-même">yourself</label>
<input type="radio" name="person" id="option1"/>

<label for="option2" data-selected="en" data-en="a colleague" data-fr="Un collegue">a colleague</label>
<input type="radio" name="person" id="option2"/>