简单的JS滑块 - 旋转不起作用

时间:2017-02-25 21:05:04

标签: javascript slider

我正在尝试制作一个简单的js幻灯片。我做了一些事情但是当我点击按钮时,下一个图像只是闪烁但是没有停留。这是我的代码:

{{1}}

2 个答案:

答案 0 :(得分:1)

也许是因为你让索引过了

var imgArr = new Array();

imgArr[0] = "https://pbs.twimg.com/profile_images/696818834683142145/3SARjDxT.jpg";

imgArr[1] = "http://www.jabaixei.com.br/images/imagens_das_postagens/photoscape_logo_black.png";

imgArr[2] = "http://icon-icons.com/icons2/12/PNG/256/images_nikon_camera_1745.png";

var index = 0;

function myFunction() {
  var Image = document.getElementById("img");
  Image.src = imgArr[index];
  index++;
  if (index == 3) index = 0;
}
<img id="img" src="" " style="width:100px; "/>
<button id="btnChange " onclick="myFunction(); ">change</button>

答案 1 :(得分:0)

您必须防止计数器高于阵列中的最高索引。此外,我们可以减少您的代码。

&#13;
&#13;
package com.example.dustin.arduino_test;

import android.os.Handler;
import android.os.Looper;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.Menu;
import android.view.MenuItem;

import android.bluetooth.BluetoothSocket;
import android.content.Intent;
import android.view.View;
import android.widget.Button;
import android.widget.SeekBar;
import android.widget.TextView;
import android.widget.Toast;
import android.app.ProgressDialog;
import android.bluetooth.BluetoothAdapter;
import android.bluetooth.BluetoothDevice;
import android.os.AsyncTask;

import java.io.IOException;
import java.io.InputStream;
import java.util.UUID;


public class ledControl extends ActionBarActivity {

Button btnOn, btnOff, btnDis, btnRead;
SeekBar brightness;
TextView lumn;
String address = null;
TextView potRead;
private ProgressDialog progress;
BluetoothAdapter myBluetooth = null;
BluetoothSocket btSocket = null;
private boolean isBtConnected = false;
//SPP UUID. Look for it
static final UUID myUUID = UUID.fromString("00001101-0000-1000-8000-00805F9B34FB");
Handler blueToothIn;
private StringBuilder recDataString = new StringBuilder();
private readThread read;

@Override
protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);

    Intent newint = getIntent();
    address = newint.getStringExtra(DeviceList.EXTRA_ADDRESS);       

    //view of the ledControl
    setContentView(R.layout.activity_led_control);

    //call the widgtes
    btnOn = (Button)findViewById(R.id.button2);
    btnOff = (Button)findViewById(R.id.button3);
    btnDis = (Button)findViewById(R.id.button4);
    btnRead = (Button)findViewById(R.id.Read);
    brightness = (SeekBar)findViewById(R.id.seekBar);
    lumn = (TextView)findViewById(R.id.lumn);
    potRead = (TextView)findViewById(R.id.PotReading);
    final String str = "TAG";

    new ConnectBT().execute(); //Call the class to connect

    blueToothIn = new Handler(){
        public void handleMessage(android.os.Message msg) {
            String readMessage = (String) msg.obj;
            recDataString.append(readMessage);
            int endOfLineIndex = recDataString.indexOf("~");
            if (endOfLineIndex > 0) {
                String dataInPrint = recDataString.substring(0, endOfLineIndex);
                if (recDataString.charAt(0) == '#') {
                    String potVal = recDataString.toString();
                    Log.v(str, "set pot text");
                    potRead.setText(potVal);
                    Log.v(str, potVal);
                }
                recDataString.delete(0,recDataString.length());
            }
        }
    };

    //commands to be sent to bluetooth

    btnRead.setOnClickListener(new View.OnClickListener()
    {
        @Override
        public void onClick(View v)
        {
            if (myBluetooth != null) {
                try {
                    btSocket.connect();
                    Log.v(str, "Socket Connected");
                    read = new readThread(btSocket);
                    read.start();
                    Log.v(str, "READ THREAD STARTED");
                } catch (IOException e) {
                    Log.v(str, "Catch on bt.connect");
                    Log.v(str, e.toString());
                    try {
                        btSocket.close();
                    } catch (IOException e2) {
                        //insert code to deal with this
                    }
                }
            }
        }
    });

    btnOn.setOnClickListener(new View.OnClickListener()
    {
        @Override
        public void onClick(View v)
        {
            turnOnLed();      //method to turn on
        }
    });

    btnOff.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v)
        {
            turnOffLed();   //method to turn off
        }
    });

    btnDis.setOnClickListener(new View.OnClickListener()
    {
        @Override
        public void onClick(View v)
        {
            Disconnect(); //close connection
        }
    });

    brightness.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
        @Override
        public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
            if (fromUser==true)
            {
                lumn.setText(String.valueOf(progress));
                try
                {
                    btSocket.getOutputStream().write(progress);
                }
                catch (IOException e)
                {
                    msg("Bluetooth socket exception");
                }
            }
        }

        @Override
        public void onStartTrackingTouch(SeekBar seekBar) {

        }

        @Override
        public void onStopTrackingTouch(SeekBar seekBar) {

        }
    });
}

private class readThread extends Thread{

    private final InputStream btIn;
    String str = "READ THREAD";

    private readThread(BluetoothSocket socket){
        InputStream tmpIn = null;
        try{
            tmpIn = socket.getInputStream();
            Log.v(str, "Input Stream Test");
        }catch (Exception e){
            Log.v(str, "Exception");
            Log.v(str, e.toString());
        }
        btIn = tmpIn;
    }

    public void run(){
        byte[] buffer = new byte[256];
        int bytes;
        if(btSocket !=null){
            while(true) {
                try {
                    Log.v(str, "Got to run method");
                    bytes = btIn.read(buffer); /// this does not work
                    String readMessage = new String(buffer, 0, bytes);
                    //Send the obtained bytes to the UI Activity via handler
                    blueToothIn.obtainMessage(0, bytes, -1, readMessage).sendToTarget();
                } catch (IOException e) {
                    Log.v(str, e.toString());
                }
            }
        }
    }
}


private void Disconnect()
{
    if (btSocket!=null) //If the btSocket is busy
    {
        try
        {
            btSocket.close(); //close connection
        }
        catch (IOException e)
        { msg("Error");}
    }
    finish(); //return to the first layout

}

private void turnOffLed()
{
    if (btSocket!=null)
    {
        try
        {
            btSocket.getOutputStream().write(0);
        }
        catch (IOException e)
        {
            msg("Error");
        }
    }
}

private void turnOnLed()
{
    if (btSocket!=null)
    {
        try
        {
            btSocket.getOutputStream().write(255);
        }
        catch (IOException e)
        {
            msg("Error");
        }
    }
}

// fast way to call Toast
private void msg(String s)
{
    Toast.makeText(getApplicationContext(),s,Toast.LENGTH_LONG).show();
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_led_control, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();

    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}

private class ConnectBT extends AsyncTask<Void, Void, Void>  // UI thread
{
    private boolean ConnectSuccess = true; //if it's here, it's almost connected

    @Override
    protected void onPreExecute()
    {
        progress = ProgressDialog.show(ledControl.this, "Connecting...", "Please wait!!!");  //show a progress dialog
    }

    @Override
    protected Void doInBackground(Void... devices) //while the progress dialog is shown, the connection is done in background
    {
        try
        {
            if (btSocket == null || !isBtConnected)
            {
                myBluetooth = BluetoothAdapter.getDefaultAdapter();//get the mobile bluetooth device
                BluetoothDevice device = myBluetooth.getRemoteDevice(address);//connects to the device's address and checks if it's available
                btSocket = device.createInsecureRfcommSocketToServiceRecord(myUUID);//create a RFCOMM (SPP) connection
                BluetoothAdapter.getDefaultAdapter().cancelDiscovery();
                btSocket.connect();//start connection
            }
        }
        catch (IOException e)
        {
            ConnectSuccess = false;//if the try failed, you can check the exception here
        }
        return null;
    }
    @Override
    protected void onPostExecute(Void result) //after the doInBackground, it checks if everything went fine
    {
        super.onPostExecute(result);

        if (!ConnectSuccess)
        {
            msg("Connection Failed. Is it a SPP Bluetooth? Try again.");
            finish();
        }
        else
        {
            msg("Connected.");
            isBtConnected = true;
        }
        progress.dismiss();
    }
}
&#13;
// We can declare and fill the array in one statement:
var imgArr = ["http://www.greatgrubclub.com/domains/greatgrubclub.com/local/media/images/medium/4_1_1_apple.jpg", 
              "http://cdn.playbuzz.com/cdn/4bcb7941-ba24-495e-8bc1-6145e8bf1bb5/1be9da1e-92d6-471d-801a-09168c01a5ac.jpg", 
              "http://images.wisegeek.com/red-and-green-barlett-pears.jpg"];
              
var index = 0;              

// Just scan the document for the image element once,
// not every time the function runs
var img =  document.getElementById("img");
var btn =  document.getElementById("btn");

// You have to set up the click of the button to invoke your function
btn.addEventListener("click", myFunction);

function myFunction(){
 img.src= imgArr[index];

 // If the counter is less than one less than the array length, increment it
 // Otherwise, reset it to zero.
 if (index < imgArr.length - 1){
   index++;
 } else {
   index = 0;
 }
}
&#13;
img { width: 50px; }
&#13;
&#13;
&#13;