Laravel使用javascript更改刀片文件中的图像

Question

I am trying to use javascript to change an image in my blade file but am getting the following error. As a side note I have enabled HTML forms in laravel, and I am able to display images without javascript.

Fatal error: Class 'HTML' not found (View:/home/vagrant/Code/Laravel/resources/views/pages/progress.blade.php)

Below is my javascript code

<script>
window.onload = function() {
changeImageForSeniorLevel();

};

function changeImageForSeniorLevel() {
var level = '<?php echo $levelValue; ?>';

if (level == 3)
{
document.getElementById("image").src="{{ HTML::image('progress2/Icons/Calls_Icon.png', 'alt',array('width' => 150 )) }}";
}
}
</script>

Here is the code for the image I am trying to change, the code will display an image if I comment my javascript.

{{ HTML::image('progress2/Icons/Meetings_Icon.png', 'alt', array('id' => 'image', 'width' =>150)) }}

Answer 1

HTML::image is a Laravel class / method that is parsed in PHP (which is hosted on your server). You cannot parse it using a browser / HTML. The browser does not know what HTML::image means. In your case, you just want to change the attributes of an image already drawn on your document.

You can use the following to achieve what you are looking for:

if(level == 3){
    var myImage = document.getElementById("image");
    myImage.src = 'progress2/Icons/Calls_Icon.png';
    myImage.alt = 'alt';
    myImage.style.width = '150px';
}