不使用onclick和JavaScript的按钮

时间:2017-03-30 17:10:53

标签: javascript html

我正在尝试为输入添加10,100和1000,并且可以清除输入字段,但我无法使其工作。我已经尝试了不同的方法,我知道将脚本添加到我的文档(内联和外部),但我似乎无法破解代码。调试控制台告诉我函数未定义

修改

问题似乎是当点击按钮时,网站会重定向到索引文件



import UIKit
import MapKit

class LocationSearchTable : UITableViewController {

    var matchingItems = [CustomAnnotations]()
    var mapView: MKMapView? = nil

    var handleMapSearchDelegate:HandleMapSearch? = nil

    func parseAddress(selectedItem:MKPlacemark) -> String {
        // put a space between "4" and "Melrose Place"
        let firstSpace = (selectedItem.subThoroughfare != nil && selectedItem.thoroughfare != nil) ? " " : ""
        // put a comma between street and city/state
        let comma = (selectedItem.subThoroughfare != nil || selectedItem.thoroughfare != nil) && (selectedItem.subAdministrativeArea != nil || selectedItem.administrativeArea != nil) ? ", " : ""
        // put a space between "Washington" and "DC"
        let secondSpace = (selectedItem.subAdministrativeArea != nil && selectedItem.administrativeArea != nil) ? " " : ""
        let addressLine = String(
            format:"%@%@%@%@%@%@%@",
            // street number
            selectedItem.subThoroughfare ?? "",
            firstSpace,
            // street name
            selectedItem.thoroughfare ?? "",
            comma,
            // city
            selectedItem.locality ?? "",
            secondSpace,
            // state
            selectedItem.administrativeArea ?? ""
        )
        return addressLine
    }

    func search(keywords:String) {
        self.matchingItems.removeAll()
        for annotation in self.mapView!.annotations {
            if annotation.isKindOfClass(CustomAnnotations) {
                //Just an example here for searching annotation by title, you could add other filtering actions else.
                if (annotation.title??.rangeOfString(keywords) != nil) {
                    self.matchingItems.append(annotation as! CustomAnnotations)
                }
            }
        }
        self.tableView.reloadData()
    }

}

extension LocationSearchTable : UISearchResultsUpdating {
    func updateSearchResultsForSearchController(searchController: UISearchController) {
        guard let mapView = mapView,
            let searchBarText = searchController.searchBar.text else { return }
        let request = MKLocalSearchRequest()
        request.naturalLanguageQuery = searchBarText
        request.region = mapView.region
        let search = MKLocalSearch(request: request)
        search.startWithCompletionHandler { response, _ in
            guard let response = response else {
                return
            }
            self.matchingItems = response.mapItems
            self.tableView.reloadData()
        }
    }

}

extension LocationSearchTable {
    override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return matchingItems.count
    }

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("MapSearchCell", forIndexPath: indexPath)
        let selectedItem = matchingItems[indexPath.row]
        cell.textLabel?.text = selectedItem.title
        cell.detailTextLabel?.text = selectedItem.subtitle
        return cell
    }

}


extension LocationSearchTable {
    override func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
        let selectedItem = matchingItems[indexPath.row]//.placemark
        handleMapSearchDelegate?.dropPinZoomIn(selectedItem)
        dismissViewControllerAnimated(true, completion: nil)
    }
}

var bet = document.getElementById('coincredits');
var cur = document.getElementById('coincredits').value;
var coins = document.getElementById('coins').value;

function clear() {
	bet.value = "";
}
function ten() {
	bet.value = cur + 10;
}
function hundred() {
	bet.value = cur + 100;
}
function thousand() {
	bet.value = cur + 1000;
}
function xtwo() {
	bet.value = cur * 2;
}
function max() {
	bet.value = coins;
}




5 个答案:

答案 0 :(得分:0)

每次调用一个函数时,都需要获取当前值。 现在,您只需获取输入的当前值(在评估脚本时)。

即。在下面的每个函数中添加以下行:ten,hundred,thousand和xtwo

var cur = document.getElementById('coincredits').value;

答案 1 :(得分:0)

此处的问题是您只在文档加载时设置cur的值。

在运行每个函数之前,您需要将cur设置为新值。

您还需要将值解析为数字,此处为int

var bet = document.getElementById('coincredits');
var cur = document.getElementById('coincredits').value;
var coins = document.getElementById('coins').value;

function updateCur() {
    var value = parseInt(document.getElementById('coincredits').value)
    if (!value)
        value = 0;
    cur = value;
}

function clear() {
	bet.value = "";
        updateCur();
}
function ten() {
        updateCur();
	bet.value = cur + 10;
}
function hundred() {
        updateCur();
	bet.value = cur + 100;
}
function thousand() {
        updateCur();
	bet.value = cur + 1000;
}
function xtwo() {
        updateCur();
	bet.value = cur * 2;
}
function max() {
        updateCur();
	bet.value = coins;
}
<h4>Coins:</h4><p id="coins">123456789</p>

<input type="number" name="coincredits" id="coincredits" required="" parsley-type="text" data-parsley-id="40">


<div>
  <button onclick="clear()">Clear</button>
  <button onclick="ten()">+10</button>
  <button onclick="hundred()">+100</button>
  <button onclick="thousand()">+1000</button>
  <button onclick="xtwo()">x2</button>
  <button onclick="max()">Max</button>
</div>

答案 2 :(得分:0)

1)将console.log('test')放在你的javascript代码的第一行,也许它不会加载

2)当浏览器渲染并绑定你的html代码时,他可能对此功能一无所知

3)你的javascript可能在它实现时没有看到文档中的任何html元素在这种情况下你应该将你所有的js代码包装成$(function(){.....}) - 它会启动你的只有在DOM准备就绪后才能使用js代码

答案 3 :(得分:0)

这里有两个问题。一个是你在页面加载时设置赌注和cur变量,而不是最新值。 第二个是你需要通过做一个标签的innerHTML来获得硬币的价值。

我修复了你的一个功能,这将帮助你解决剩下的问题。

function max() {
    var bet = document.getElementById('coincredits');
    var cur = document.getElementById('coincredits').value;
    var coinsTag = document.getElementById('coins');
    var coins= coinsTag.innerHTML;

    bet.value = coins;
}

答案 4 :(得分:0)

你有问题

var coins = document.getElementById('coins').value;

必须是.innerHTML。

我试着在这里重写你的功能。

/*declare a function call hAddCoin with parameter hValue for value and option for option +,x2,clear or max*/
function hAddCoin(hValue, option){
    var bet   = document.getElementById('coincredits'); /*get the element*/
    var coins = document.getElementById('coins').innerHTML;/*get the inner of id coins*/
    var cur   = parseInt(bet.value); /*get the coincredit and convert to integer*/
    var res   = 0; /*declare res variable for result*/
    /*we need to check bet is empty or not*/
    if(typeof bet.value === "undefined" || bet.value ==""){
        cur = 0;
    }
    /*cek the option, it's will be +, X2 or max and default to 0*/
    switch(option){
      case 1:{
        res = cur + hValue;
      }break;
      case 2:{
        res = cur * option;
      }break;
      case 3:{
        res = parseInt(coins);
      }break;
      default:{
        res = 0;
      }break;
    }

      bet.value = res;/*set value coin creadit to result*/
  }
<h4>Coins:</h4><p id="coins">123456789</p>

<input type="number" name="coincredits" id="coincredits" required="" parsley-type="text" data-parsley-id="40">


<div>
  <button onclick="hAddCoin(0,0)">Clear</button>
  <button onclick="hAddCoin(10,1)">+10</button>
  <button onclick="hAddCoin(100,1)">+100</button>
  <button onclick="hAddCoin(1000,1)">+1000</button>
  <button onclick="hAddCoin(0,2)">x2</button>
  <button onclick="hAddCoin(0,3)">Max</button>
</div>