Question

   <img src="<?php echo $this->webroot; ?>img/yes.png" onclick="save(this);" id="btnyes" value="Yes"> &nbsp; 
     <img src="<?php echo $this->webroot; ?>img/no.png" id="btnno" onclick="save(this);" value="No">
       <img id="yes" style="display:none" src="<?php echo $this->webroot; ?>img/green.png"  alt="">
        <img id="no" style="display:none" src="<?php echo $this->webroot; ?>img/green.png"  alt="">

当我点击是按钮时，它应该变为绿色勾选和当我点击没有按钮时，它应该变为红色勾选

<script type="text/javascript">
function save(obj) {

  if(obj.value='yes'){
    document.getElementById('btnyes').style.display = 'none';
    document.getElementById('btnno').style.display = 'none';
    document.getElementById('yes').style.display = 'block';
    document.getElementById('no').style.display = 'none';
  } 
  else if {
    document.getElementById('btnyes').style.display = 'none';
    document.getElementById('btnno').style.display = 'none';
    document.getElementById('yes').style.display = 'none';
    document.getElementById('no').style.display = 'block';
  }
}

</script>

此功能的脚本在上面。但是当我点击这两个按钮中的任何一个时，没有发生任何变化。这是什么错误？

Answer 1

您的文件中有几处错误：

这是你的HTML：

 class gotoparent extends AsyncTask<String,String,String>

{
    @Override
    protected String doInBackground(String... params) {
        runOnUiThread(new Runnable() {
            @Override
            public void run() {



                        Animation animation= AnimationUtils.loadAnimation(getApplicationContext(),R.anim.rotete);
                        lin2.startAnimation(animation);




            }
        });

        return null;
    }

    @Override
    protected void onPostExecute(String s) {
        super.onPostExecute(s);
        new Handler().postDelayed(new Runnable() {

            @Override
            public void run() {
                Intent i=new Intent(getApplicationContext(),ParentsCornor.class);
                startActivity(i);

            }
        }, 1200);

    }
}

这是你的JS：

 <img onclick="save(this);" id="btnyes" value="Yes">

＆＃34;是＆＃34; 不等于＆＃34;是＆＃34;。此外，if(obj.value='yes'){ document.getElementById('btnyes').style.display = 'none'; document.getElementById('btnno').style.display = 'none'; document.getElementById('yes').style.display = 'block'; document.getElementById('no').style.display = 'none'; }未检查if(obj.value='yes')的值。

下面的代码段错误。您需要指定obj.value或将其更改为else if("condition")。

else

Answer 2

只有输入元素具有value属性。但是您在图像中使用了值，因此您可以使用：

if(obj.getAttribute('value')=='yes'){//compare with == not with =

建议：

请使用html5 data- *属性。例如。 data-value="yes"然后使用getAttribute('data-value')。

demo

Answer 3

首先，你的javascript代码中的else if条件附近存在语法错误。

其次，你不能对图像使用“value”属性。

第三，您使用“=”进行比较，而它应为“==”

最后，您将“是”与“是”进行比较。因此，区分大小写，比较失败。

我对您的代码进行了一般性更改。请尝试，看看你是否得到正确的警报。然后您可以根据需要在其中添加代码。

<script language="javascript">

function save(obj){


if(obj.getAttribute("value") =='Yes'){
 alert("I am in Yes");

 } 
 else {

   alert("I am in No");

     }
}

</script>

希望有所帮助！

Answer 4

你有很多事要纠正。

首先，obj.value == 'yes'不是obj.value='yes'

其次，您应该使用obj.getAttribute('value')代替obj.value。

第三，在您的代码中，您使用<?php echo $this->webroot; ?>img/green.png两次。但似乎你应该第二次使用<?php echo $this->webroot; ?>img/red.png。

整个代码看起来像;

<强> HTML

<img src="<?php echo $this->webroot; ?>img/yes.png" onclick="save(this);" id="btnyes" value="yes"/> &nbsp; 
<img src="<?php echo $this->webroot; ?>img/no.png" onclick="save(this);" id="btnno" value="no"/> 
<img id="yes" style="display:none" src="<?php echo $this->webroot; ?>img/green.png"  alt="">
<img id="no" style="display:none" src="<?php echo $this->webroot; ?>img/red.png"  alt="">

<强>的JavaScript

function save(obj){
  if(obj.getAttribute('value')=='yes'){
    document.getElementById('btnyes').style.display = 'none';
    document.getElementById('btnno').style.display = 'none';
    document.getElementById('no').style.display = 'none';
    document.getElementById('yes').style.display = 'block';
  } else{
    document.getElementById('btnyes').style.display = 'none';
    document.getElementById('btnno').style.display = 'none';
    document.getElementById('yes').style.display = 'none';
    document.getElementById('no').style.display = 'block';
  }
}

这是一个有效的演示https://jsfiddle.net/sa215dv0/1/

希望这有帮助

Javascript onclick按钮更改

4 个答案: